← Lessons

quiz vs the machine

Gold1420

Frontend

Rendering Strategies CSR SSR and SSG

Where and when your HTML gets generated.

5 min read · core · beat Gold to climb

Three places to render

Modern frameworks let you decide where HTML is produced. The choice trades off speed, freshness, and server cost.

Client side rendering

With client side rendering the server sends a near empty shell and JavaScript builds the page in the browser.

  • Cheap to host as static files.
  • Slower first paint and weaker for search crawlers.

Server side rendering

With server side rendering the server builds full HTML for each request.

  • Fast first paint and good for dynamic, per user content.
  • Costs server work on every request.

Static site generation

With static site generation pages are built once at deploy time and served from a CDN.

  • Fastest and cheapest to serve.
  • Content is frozen until the next build.

Key idea

Choose static generation for stable content, server rendering for fresh per request data, and client rendering for app shells, mixing them per route as needed.

Check yourself

Answer to earn rating on the learn ladder.

1. Which strategy serves pages built once at deploy time?

2. A downside of server side rendering is