SSR, CSR, SSG, ISR - when to use which, how, why whats

Rajinder Kumar

Tue, 28 May' 24

grocery app

In Today's scenario web development becomes much scalable and faster and every business needs website to made their business profitable and scalable but it's very important to optimize the website by choosing correct approaches and technologies to make website faster secure, scalable and seo friendly to achieve these features it's very important to choose correct Web page rendering technology so in this blog we will learn about webpage rendering technologies which help you to choose efficient and scalable according to your need let's learn about one by one 1 Server side rendering (SSR) : As the name suggests SSR stands for server side rendering in this technique the web page is rendered on the server and after page rendered.the server sends page to the client Why to use SSR : 1. Decrease waiting Time: it's a much faster approach and decrease waiting time for the client 2. SEO : it's very beneficial for seo because all the keywords directly matches in the search by crawler 3. Better user experience: it increases user experience as compare with normal page renderings 2 . Client Side Rendering (CSR) : in this approach the server sends html css and js to client browser and browser renders this data And generates the webpage on clients browser Why use CSR : 1. Decrease server load : by rendering the page on clients browser decreases server load which mades server faster 2. Scalable: CSR is a scalable technique which Has ability to handle millions of requests on same time 3. Faster response: as discussed in above Point CSR decrease load on server as a result server respond very faster 3. Static site generation (SSG) : In SSR the full webpage statically generated on the server and when server gets any request then server returns this page as response How SSG different from SSR If we compare SSG with SSR the main difference is page rendering timing SSR - renders new page for every request eg : if server gets 10 requests then server renders new page for each request means 10 pages for 10 requests. SSG : but in SSG it's different here server renders a static page on build time and store it and whenever server gets request returns same page for each request eg if server gets 10 requests then server returns same page for all these requests Why to use SSG 1. decrease waiting time : SSG is a much faster way of page rendering because static content of the page is already generated. 2. low server load : SSG also decrease load from the server because server no need to regenerate new page for new request 3. Enhance User experience: as we discussed above SSG makes server faster which increases user experience. 4 ISR ( increament site generation): Increament site generation is the combination of SSG ( static site generation) and SSR (server side rendering) in this the main difference was it's only generates static content on build time and on run time it updates the dynamic data. Which fullfill the drawback of Static site generation which not reflect Dynamic data frequently Why use ISR : 1. Speed: ISR provides high speed which increases user experience 2. User Experience: it increases user experience and decrease load time 3. Suitable For Dynamic Application: it's suitable for dynamic application where data changed very frequently