Caching with Cache Components

Next.js 16 caching centers on Cache Components, enabled with cacheComponents: true in next.config. The "use cache" directive caches the return value of an async function, or an entire component, page, or layout; placed at the top of a file it caches every export. Cached results become part of the prerendered static shell and may be included in prefetches. A component that needs fresh data on every request omits "use cache" and renders inside a Suspense boundary, so the fallback ships with the static shell while the async work streams at request time. Reading runtime data such as cookies() inside a Suspense boundary does not opt the whole route into dynamic rendering the way the previous rendering model did. The older fetch cache options, route segment config, and unstable_cache are documented separately as the previous caching model. Scope: Next.js 16 with Cache Components enabled. Reviewed October 4, 2026.