Rendering Strategies
Where and when HTML gets built: on the client, the server or at build time.
Backend Engineer
Junior
Write correct code, ship small changes safely, ask good questions.
- Client-Side Rendering (CSR)The browser builds the page with JavaScript.
- Multi-Page Application (MPA)Traditional sites where each page is a full load.
- Server-Side TemplatesHTML generated by templates like Jinja, ERB or Thymeleaf.
- Single-Page Application (SPA)One HTML page whose content changes through JavaScript.
- sitemap.xml and robots.txtTelling crawlers what to index and what to skip.
- Static Site Generation (SSG)Building HTML once, at build time.
Mid-level
Own a feature end to end without hand-holding.
- SEOMaking pages discoverable and well ranked by search engines.
- Rendering StrategiesWhere and when HTML gets generated.
- Server-Side Rendering (SSR)The server builds HTML for each request.
- Canonical URLTelling search engines which URL is the original.
- Hypermedia-Driven Apps (htmx)Swapping server-rendered HTML fragments instead of building a SPA.
Senior
Own a system, its failure modes, and its trade-offs.
- CSR vs SSR vs SSGChoosing a rendering strategy for SEO, speed and complexity.
- Edge RenderingRendering close to users on CDN edge servers.
Frontend Engineer
Junior
Build UI that works, ship small changes safely, ask good questions.
- Client-Side Rendering (CSR)The browser builds the page with JavaScript.
- Multi-Page Application (MPA)Traditional sites where each page is a full load.
- Single-Page Application (SPA)One HTML page whose content changes through JavaScript.
- SEOMaking pages discoverable and well ranked by search engines.
- sitemap.xml and robots.txtTelling crawlers what to index and what to skip.
- Static Site Generation (SSG)Building HTML once, at build time.
Mid-level
Own a feature end to end without hand-holding.
Core: start here
- Server-Side Rendering (SSR)The server builds HTML for each request.
- CSR vs SSR vs SSGChoosing a rendering strategy for SEO, speed and complexity.
5 more mid-level concepts
- Progressive EnhancementA baseline that works without JavaScript, enhanced when it's available.
- Progressive Web AppA web app that can be installed and used offline like a native one.
- Rendering StrategiesWhere and when HTML gets generated.
- Canonical URLTelling search engines which URL is the original.
- Hypermedia-Driven Apps (htmx)Swapping server-rendered HTML fragments instead of building a SPA.
Senior
Own an app's architecture, performance, and failure modes.
Core: start here
- Streaming SSRSending HTML in chunks as it becomes ready.
2 more senior concepts
- Edge RenderingRendering close to users on CDN edge servers.
- Incremental Static RegenerationRebuilding static pages in the background after deploy.
Tech Entrepreneur
Product-Market Fit
Get users who stay, pay and tell others; raise your first real round.
- SEOMaking pages discoverable and well ranked by search engines.