Server-Side-Rendering

CSR (Client Side Rendering):

A client-side route happens when the route is handled internally by the JavaScript that is loaded on the page

PROS

• Rich Interactions
• Faster Response
• Web Applications

CONS

• Low SEO potential
• Longer initial load

SSR (Server Side Rendering):

While browsing, the adjustment of a URL can make a lot of things happen. This will happen regularly by clicking on a link, which in turn will request a new page from the server. This is what we call a server-side route. A whole new document is served to the user.

PROS

• Static Sites
• SEO
• Initial Page Load

CONS

• Full Page Reloads
• Slower Page rendering
• Requests to server

Next.js:

• Assists with less full page refresh for server side rendering using such features like Link (Note: With client side rendering you do not need to refresh the entire page but with server side rendering you do)

Check out the documentation for more information: https://nextjs.org/docs

Helpful Links:

• https://medium.com/@wilbo/server-side-vs-client-side-routing-71d710e9227f (Server-side vs Client-side Routing)
• https://developers.google.com/search/docs/guides/javascript-seo-basics (Understand the JavaScript SEO basics)