next-cache-components

To mix static prerendering and dynamic streaming in Next.js, enable `cacheComponents: true` in your configuration and apply the `use cache` directive to specific components or functions to selectively cache async data while streaming request-specific parts via Suspense.

You invalidate cached data in Next.js Cache Components by tagging it with `cacheTag()` during the fetch, then triggering a refresh using `updateTag()` for an immediate refresh or `revalidateTag()` for a background update.

You cannot use `cookies()`, `headers()`, or `searchParams` inside a standard `use cache` directive due to runtime constraints; you must use `use cache: private` instead to handle request-specific data safely.

The best way to control cache staleness for Next.js server components is to apply the `use cache` directive at the function or component scope and define the duration using the `cacheLife()` function, such as `cacheLife("hours")`.

You should enable `cacheComponents` in next.config when your production routes need partial prerendering, selective caching for async data, and tag-based invalidation for frequently changing records within a single route.