Rendering Strategies
Client, server, static and incremental rendering, and what each costs on first paint.
5 to work through
-
intermediate
A marketing site is a client-rendered single-page application. Organic traffic is poor and the team blames the search engine. What is your assessment?
1 min answer -
intermediate
A team must choose between static generation, incremental regeneration, server rendering and client rendering for different parts of a product. What decides each, and what is the common mistake?
2 min answer -
advanced
A client-rendered single-page application has poor loading performance and poor search visibility across 140 routes. The team wants server rendering with streaming. There is no appetite for a rewrite and the application must keep shipping weekly. What is the sequence, and where can it go wrong?
3 min answer -
advanced
A commerce platform must choose between server rendering, static generation, client rendering and streaming for different pages. What decides each?
2 min answer -
advanced Multiple choice
A news site has article pages read by millions, a homepage updated constantly, and a subscriber account section. Should it pick one rendering strategy?
1 min answer
3 terms in this topic
Render Location Decision
Where HTML is produced — build time, server, edge or browser — chosen per route by how personalised and how cacheable that route is.
conceptRendering Strategy
The decision about where and when HTML is produced — build time, server request time, or in the browser — which drives performance, cost and complexity.
patternShell Personalisation
Generating and caching the page that is identical for everyone, then applying per-user variation at the edge or on the client - preserving the cache …
Neighbouring topics
Frontend & Experience Architecture
General material on architecting the surface the user actually touches.
Edge Rendering
Running the render close to the user, and the personalisation and cache trade it implies.
Hydration Cost
The gap between visible and interactive, and the JavaScript that closes it.
Micro-Frontends
Independent deployment of UI slices, and the shared runtime that undermines it.
Module Federation
Loading code from another build at runtime, with versioning and failure to think about.
UI Monorepo Strategy
One repository for many front ends, and the build graph that makes it viable.
Design Systems
Components as a versioned internal product, with adoption and deprecation like any API.
Component Contracts
Props, slots and events as an interface, and the breaking change hidden in a style.
Client State Architecture
Server state, UI state and derived state, and why conflating them causes most bugs.
Client Caching & Data Layer
Stale-while-revalidate, invalidation and optimistic updates on the client.
BFF for Experience
One backend per experience, shaped by the screen rather than by the domain.
API Shapes for UI
REST, GraphQL and RPC judged by over-fetching, round trips and client coupling.
Web Performance Budgets
A number a build can fail against, rather than a performance sprint once a year.
Core Web Vitals
LCP, INP and CLS — what they measure, and the architecture that moves them.
Accessibility Architecture
Semantics, focus management and announcements designed in rather than audited in.
Internationalisation
Locale, direction, pluralisation and dates as structural concerns, not string tables.
Client Feature Flags
Flag evaluation on a device you do not control, and the flicker and staleness it brings.
Real User Monitoring
Field data from real devices and networks, against the synthetic run that looked fine.
Frontend Security
CSP, XSS, CSRF, token storage, and the trust boundary that ends at the browser.