What are the differences between client-side and "Rendering" server-side?

Question

Lately I’ve seen a lot of the term server-side rendering, especially with the popularization of some frameworks and libraries, but I still can’t understand what improvements this can bring to a system.

I would like to know the differences between these two types of renderings and also the pros and cons of them.

Answer 1

This is about who assembles the content to be presented.

If it is on the server it obviously has all the work of assembling a text that will be the page to be delivered to the client essentially ready for use.

If it is on the client, a set of pages plus several codes will be received by the client and from there it will only communicate with the server to ask for new information that you need, everything you need to modify and adapt in the presentation of the page takes place in the same client.

There are hybrid cases.

Obviously drawing everything on the client can download a little the need for the server to work. In theory, because depending on the case do several isolated requests can generate so much load that can be worse than render on the server. Not to mention that the developer can do everything wrong and make the situation worse.

Rendering on the client can bring more insecurity, breach of privacy, piracy of code. Of course, most of these things can be solved with some work.

Client rendering does not usually go very well with SEO, even if some people believe that there is no problem, IE, sr usually not very good for websites. It works better and has more advantages in web applications that are quite different.

Amazingly there is no control so good rendering in the client, at least in the current state of technology.

I need to leave, I’ll finish later.

Answer 2

Server Side Rendering

The server processes the requested data, generates the page and transmits the HTML ready page to the client. The browser reads the HTML and "draws" the page to the person.

Pros:

• The server is a machine with large processing capacity and the larger processing is on the server
• Customer does not need to worry much with data processing, only with the reception and display of the page itself.

Cons:

• The entire ready-made page should be transmitted via network/internet. This increases bandwidth usage.
• Whenever some processing is required, the client calls the server that does the whole process again, generating a new page on the server that will be fully relayed to the client. This process requires more network/internet bandwidth.

Client Side Rendering

The client sends request for the desired data and renders the page by itself. Only the data is received, the client has the job of generating the page to be displayed in the browser.

Pros:

• It is not necessary to transfer the whole page via network/internet with each change. Only the new data is transferred.
• Does not overload the server so much in case of many clients.

Cons

• Increases customer side processing, perhaps requiring a better machine in customers. Changing the page by the client is a procedure that naturally costs a lot of resources. Using too much causes slowness.
• Client-side applications (javascript) expose client application code.

---

Personal opinion

In my opinion, the interesting is to initially generate the first page on the server side and the changes/updates generate on the client side.