If you’re new to making apps for the web and wondering what is client-side rendering and server-side rendering and the differences between the two then this article is right for you.
Differences between SSR and CSR
Initial page load is faster than most client-side render apps especially on older hardware, and when users have a poor/low speed internet connection.
Common UI flickers that happen with CSR apps doesn’t happen as often with SSR
Great for SEO as content is ready to go for search engine crawlers. It offers easier SEO management as well. Think: adding meta tags, or a keyword on every page.
Server-side rendering works great with text-based sites.
Simple sites for displaying static content
Handling initial render when a user (or search engine crawler) makes the first request to your app.
Rendering a homepage or index page that displays a visual map or collection of different routes a user can take on the app. Think: college portal displaying options to go to admissions, grades, housing, meal plans, etc.
Fast website rendering after initial load
Rich site interactions
Can use caching effectively
Robust selection of js libraries
Overall great for providing users a native feel on a web app
Initial iteration of project. CSR usually allows for fast development, and easier debugging
You intend to make a mobile app or progressive web app version from this CSR web app
Server resources are scarce due to lack of funds or inability to scale