Rendering Modes — Senior Interview Prep
The “where does HTML come from” question — client-rendered, server-rendered, statically generated, incrementally regenerated, streamed, edge-rendered. The senior position: there is no one best mode — pick per route based on data freshness, SEO, personalization, and performance budget. Most real apps use a hybrid mix.
Files
The hybrid baseline
A real fullstack app rarely picks one mode. A common shape:
| Route | Mode | Why |
|---|---|---|
Marketing landing (/) |
SSG or ISR | static, SEO-critical, change infrequently |
Blog post (/blog/:slug) |
ISR (revalidate hourly) | mostly static, sometimes updated, SEO matters |
Search results (/search?q=...) |
SSR | dynamic per query, can’t pre-build |
User dashboard (/dashboard) |
RSC + client islands | per-user, behind auth, SEO doesn’t matter |
Admin panel (/admin/*) |
SPA / CSR | heavy interactivity, behind login, no SEO |
API routes (/api/*) |
server functions | mutations + data fetching |
Next.js App Router and Nuxt make this per-route choice declarative. Older SPA-only stacks (CRA-style) force one mode.
Cross-references
- React Server Components: ../05_react/server_components.md
- Hydration: ../05_react/hydration.md
- Next.js App Router layout: ../12_project_structure/04_nextjs_app_router_layout.md
- Nuxt rendering modes: ../06_vue/11_nuxt.md
- Core Web Vitals (rendering mode affects LCP/INP/CLS): ../15_performance/01_core_web_vitals.md