Next.js
Fetch
In App Router, fetch runs on the server in RSC and ties into caching and rendering modes.
Server-side fetch
- In RSC,
fetchruns on the server and caches by default. - In Client Components,
fetchbehaves like browserfetch.
Cache policies
fetch(url); // cache: "force-cache" (default)fetch(url, { cache: "no-store" }); // SSR every requestfetch(url, { next: { revalidate: 60 } }); // ISRRendering mode mapping
| fetch config | Mode |
|---|---|
cache: "force-cache" | SSG / ISR |
next: { revalidate } | ISR |
cache: "no-store" | SSR |
| cookies/headers | SSR |
What makes a route dynamic
- cookies or headers
cache: "no-store"dynamic = "force-dynamic"- dynamic params