what is CSR , SSR ,SSG, ISR

Client Side Rendering(CSR)

If you used React before you would have heard acronym CSR short for Client side rendering. Client side rendering means that our browser is responsible for creating a full interactive web pages.

CSR follows following step to generate the page.

1) Client request for a page.
2) Server serves an empty html file along side with javascript and css
3) Client runs javascript code and renders the page and fetch necessary data to build the page.
4) Client output full page to a user.

CSR provides an APP like experience and provides high quality of user interactivity. However, CSR initially serve an empty html file which makes it hard for web crawlers to know what content the page has and thus bad for SEO. CSR is a good option for an application that doesn't concern about SEO and prioritize a smooth user experience.

Server Side Rendering(SSR)

In server side rendering, the web page is rendered on the server on every clients request.

1) Client request for a page
2) Server runs Javascript code and fetches data and Renders the page.
3) Server serves Client with Fully rendered page.

Server Side Rendering offers good SEO and data is always up to date as page is built on the server on every request. SSR can be a great option for E-commerce as data is frequently updated in E-commerce websites.

Static Site Generation(SSG)

Static site Generation in other hand, already has web page built in built time. When client request for a page from a server, server simply serves built page. This offers fast load time and also these static files can be cached which offers even faster load time. However, SSG is not so good for website that frequently updates because the page needs to be built again for updated contents. If you are looking to build landing pages, marketing pages, Documentations that doesn't require frequent update, SSG will be the go to option.

Incremental Static Regeneration (ISR)

Incremental Static Regeneration offers alternative to SSG if you require an update in your static page. ISR re-validates the static page periodically and updates the static files. This could be really handy if you want advantages of SSG but still want updated contents.