Server-side Rendering (SSR)

What is Server-Side Rendering? 

SSR is a technique of rendering web applications on the server and returning responses to users. It is the ability of an application to contribute in displaying the web page on the server instead of rendering it in the browser.  This means as soon as the user opens a web application, it sends a request to the server which returns a response together with the content i.e HTML, CSS, JavaScript, and other assets required to display the content to the user. 

Unlike, Client-side rendered application SSR returns a page with the content is to the user. The disadvantage of this approach is that request is always made to the server whenever a user clicks a link. This may be slow as the server has to go through the process of handling the request then returning the HTML, CSS, and JavaScript files. 

A hybrid of SSR and CSR is the best possible solution to tackle this hindrance. This hybrid model is known as a Universal or Isomorphic app in some circles. In an Isomorphic app, we can reduce the slow initial load time by Client-side rendered applications via initial HTML rendering from the server. Later on, it lets the client take over rendering responsibilities thus eliminating the frequent requests made to the server in SSR apps. 

Benefits of SSR 

  1. Faster Initial Load Time: An SSR app only delivers what a user requests. It proceeds further with the initial request made and doesn’t wait until all the JavaScript files are loaded. It is commonly known as Time to First Byte; which is the response time as soon as a user clicks a link to get feedback.
  2. Good for SEO: SSR apps are appropriate for Search engines (Google, Bing, etc.) as Search engine bots can crawl the entire app and index its pages. Unlike Client-side rendered apps that load and update just a single page.
  3. Great for Static Sites: SSR can be great for building static sites as the server returns a full HTML to the user. 

Drawbacks of SSR 

  1. Frequent Server Requests: Numerous performance issues occur as every request via the user is returned to the server for processing.
  2. Overall Slower Load Time: Overall load time is slower as the server has to process each request compared to single-page applications. A single-page Application only fetches all the required content at the initial load time. Furthermore, in larger SSR applications processing requests shall take some time which may lead to a slow Time To First Byte.