Frontend category will cover the latest trends in front-end frameworks and the web ecosystem. I would also like to include essential knowledge of JavaScript and TypeScript for beginners, along with advanced topics such as caching strategies and performance optimisation.

Frontend

Server-side rendering(SSR) can't be the silver bullet

Server-side rendering definitely has many advantages. However, it should be used carefully as there are pros and cons depending on the situation, and there are also frequent cases where CSR is better in terms of development cost or performance. In this post, I will briefly compare and summarise SSR and CSR, and then discuss whether server-side rendering really brings fast loading or not.


SSR is a technique where web pages are generated on the server and sent to t. To be clear, SSR is what web used to be. Web pages used to be always populated from server side until client-side rendering(CSR) become a trend. 

This means that the initial render of the page is done on the server, rather than in the client's browser.

 SSR can improve SEO, page load times, and the user experience on slower devices or networks. However, it can be more complex to set up and maintain compared to client-side rendering (CSR), and may not be necessary or beneficial for all types of web applications.

Yes, clearly one of SSR's advantages is performance. But really? Let's compare SSR and CSR first.

Serverside rendering vs client side rendering

Generates HTML on the server and sends it to the client

Provides a better user experience on slower devices or networks

Can be more complex to set up and maintain

Generates HTML in the client's browser using JavaScript

Provides a faster and more interactive experience after the initial load

Simplifies the development process and enables faster iteration

May not be as SEO-friendly or performant on slower devices or networks

I can agree the above mentioned features except the performance part.

CSR was initially introduced for better user experience including performance. With CSR + Single Page Application (SPA) users can use web like application and this combination is improving every day. Once JS bundles  are cached on client side, it will just send ajax request to server to retrieve required data only. This will reduce the workload on the server-side as well, which means with the same resource (same computing power) CSR should be faster as it uses client side resources.

Then 

 millions of people say SSR is faster? Actually it can 

 faster because when the contents are loaded, it will show completed page at one once, compared to CSR that loads contents later with following ajax requests. Hence from the user perspective, they may 

 SSR is faster. 

However that doesn't really mean SSR is faster than CSR, especially when there are a lot of requests, serving SSR pages can be a huge issue compared to CSR served by CDN.

Having said that, SSR can be still faster if you have enough server resources.

So, basically SSR may appear to have significant drawbacks that could slow down loading times, but it can still be faster due to reduced requests and round trip times. For example CSR apps will normally follow these steps below to show contents.


Client requests JS bundle files to server

After that, client evaluates javascript and start application

These steps can be different depending on the application's architecture. But the main point is every request incurs a delay.


On the other hand, SSR has a lot fewer steps as below

Front end server receive the request and send API call to API server

Front-end server populate. Physically close.


Considering the close proximity of front-end server and API server, each request time itself will be even shorter.


Hang on, what about the server cost then? Yes, that is something we might have to flexibly decide depending on the situations. SSR 

faster if you have additional settings like auto scaling or some strategy to handle the requests


It is worth noting that SSR doesn't have to render all content. For instance, modals or other content that users don't need to see initially don't require SSR. Rendering all content via SSR can significantly increase loading times. 


To conclude, SSR is not always the answer. Modern search engines can retrieve information from CSR pages effectively, making SSR less important for small projects or SaaS applications, and proper SSR comes with increased development time and extra server costs. But again, it is true that SSR can increase the performance itself. So, yes. SSR is faster than CSR : )

Is server-side rendering really faster?

Exercitation aliqua dolor ea dolore pariatur consectetur nostrud exercitation elit id mollit ullamco id. Non anim non eu mollit. Elit aliquip dolore duis occaecat. Cillum non amet amet tempor reprehenderit mollit nostrud anim reprehenderit dolor quis tempor ad.

Frontend

Is server-side rendering really faster?

Category test page