next-cache-components

Next.js 16 cache components replace experimental.ppr and unstable_cache with the use cache, cacheLife, cacheTag, updateTag, and revalidateTag APIs. This migration requires enabling cacheComponents in next.config.ts to structure static, cached, and dynamic content.

Partial Prerendering in Next.js works by serving an instant static shell while cached data and dynamic sections stream separately using Suspense boundaries. Cache components organize this route content so static, cached, and dynamic code executes independently.

You control cache invalidation in Next.js App Router server components using cacheTag, updateTag, and revalidateTag within use cache blocks. These APIs allow you to define freshness periods and manually trigger revalidation for specific cached data.

Yes, Next.js 16 enforces runtime API restrictions inside cached code using use cache. You must ensure that functions within these blocks comply with built-in cache profiles, argument-based cache keys, and private cache exceptions to avoid runtime errors.

Yes, Next.js cache components are ideal for dashboards, blogs, and product pages needing mixed content. They allow instant static UI shells to load while reusable cached data and fresh request-time personalization stream dynamically via Suspense.

You should not use use cache when private cache exceptions apply or when your route requires fully dynamic rendering without static shells. Avoid it if migrating from experimental.ppr without enabling cacheComponents in next.config.ts.