Głębiej
Te pojęcia opisują *kiedy* generujesz HTML i jak kontrolujesz świeżość.
- **SSR (Server-Side Rendering)**: render przy każdym żądaniu. Dobre dla treści dynamicznej/spersonalizowanej, ale bywa wolniejsze i droższe w skali.
- **SSG (Static Site Generation)**: render na etapie builda. Bardzo szybkie w runtime (CDN), ale dane są tak świeże jak ostatni build.
- **ISR (Incremental Static Regeneration)**: serwujesz cache/statykę i regenerujesz w tle po czasie revalidate.
Mapowanie w App Router
W App Router to głównie kwestia cache/revalidate:
- statyczny output + cachowane dane → SSG,
- `revalidate` → ISR,
- `no-store` / dynamiczny segment → SSR.
Przykład
// Odświeżaj tę trasę co 60s (ISR)
export const revalidate = 60
// Per-request (SSR)
await fetch(url, { cache: 'no-store' })
Praktyka
- SSG/ISR dla marketingu/dokumentacji i treści, która może być lekko nieaktualna.
- SSR dla dashboardów zależnych od autoryzacji i stron per użytkownik.
Typowe pułapki
- Przypadkowe wymuszenie SSR przez użycie `cookies()`/`headers()` w trasie, która miała być statyczna.
- Nadużywanie SSR i utrata korzyści z CDN.
- Zbyt długi revalidate dla danych, które muszą być świeże.