Browser & Frontend Runtime
Render strategies: multiple-choice review
Six questions that cut across the whole unit. Each one is a decision you make designing a real route — not a definition to recite, but a tradeoff between freshness, server cost, and the dead window before the page can be clicked.
Confirm you can connect when the HTML is produced (SSG/ISR/SSR/streaming) with how much of it has to become interactive (hydration, RSC) — the synthesis the individual lessons built toward.
An e-commerce product page is identical for every user, its price updates 4–6 times a day, and it must rank in search with a fast LCP. Which strategy fits best, and why?
A logged-in dashboard must be per-user fresh but has one slow order-history query (~400 ms). Plain SSR makes every user wait 400 ms for TTFB. What is the right fix?
A teammate says 'we adopted RSC, so we no longer need SSR.' Why is this wrong?
A news article — 2,000 words of text, one comment box, one like button — is fully SSR'd and fully hydrated. INP at p75 is poor. What is the highest-leverage architectural fix?
A greeting component reads the current hour during render and prints 'Good morning' or 'Good evening'. In production users see a flash and a 0.14 CLS spike, with a console warning that server and client text disagree. What is the root cause and the correct fix?
Across an e-commerce app you want to minimise hydration cost and keep INP under 200 ms on every route. What is the single most reliable rule?
The through-line of the unit is a two-axis decision. Axis one — when the HTML is produced — runs SSG (build, frozen, instant CDN hit) → ISR (bounded staleness via stale-while-revalidate) → SSR (per-request fresh, server cost on the critical path) → streaming SSR (shell first at ~50 ms, slow Suspense boundaries later). Axis two — how much of that HTML must become interactive — is governed by RSC (Server Components ship zero client code) and the hydration strategy (full → selective → islands → resumability). Production failures resolve back to these: stale prices want ISR, slow per-user queries want streaming plus Suspense, poor INP wants less hydration, and the content flash plus CLS spike is a hydration mismatch fixed by render determinism.