iTechGuides is reader-supported. When you buy through links on our site, we may earn an affiliate commission. As an Amazon Associate I earn from qualifying purchases. Learn more
In current Next.js documentation, Partial Prerendering is part of the opt-in Cache Components model. Enable it with cacheComponents: true; then use use cache to mark work whose results can be reused, and place request-dependent work behind a Suspense boundary so the route can still prerender a static shell. This lets one route combine static, cached, and request-time content without treating the whole page as one caching decision.
What Cache Components and Partial Prerendering mean
Next.js documentation now describes the feature as Cache Components, including the static-shell and request-time-content model associated with Partial Prerendering. Its guide says: “Cache Components lets you mix static, cached, and dynamic content in a single route, giving you the speed of static sites with the flexibility of dynamic rendering.” That describes the intended rendering model, not a quantified performance guarantee. Next.js: Partial Prerendering
During prerendering, Next.js can include work that can finish without request-specific information, such as synchronous file reads, module imports, and pure calculations. Work requiring runtime request data cannot be resolved into that shell ahead of time. A Suspense boundary lets the shell render its fallback while that uncached work resolves at request time; placing the boundary around the smallest useful subtree preserves more of the surrounding prerendered page.
Free tools Windows power users keep installed
One-click scans. No signup required.
Enable Cache Components
Set cacheComponents: true in the Next.js configuration to opt in. The configuration reference records the option as introduced in Next.js 16.0.0 and says it unifies the earlier ppr, useCache, and dynamicIO flags. Check the documentation for the version you deploy before changing configuration. Next.js configuration: cacheComponents
#1 Best Overall
Choose what belongs in the cache
Use use cache at file, function, or component scope. The directive marks that scope as cacheable. Its arguments and values captured from the surrounding scope contribute to the cache key, so different inputs can produce separate cached results. Choose inputs deliberately: they determine how results are partitioned, not merely what data the function receives. Next.js directive: use cache
For data that changes infrequently and does not depend on runtime request context, a cached result may be reused or included in the prerendered output. Set its lifetime with the documented cacheLife profiles or a custom lifetime, and decide how it will be invalidated. A configured lifetime governs the cache’s staleness behavior; it does not promise that the origin is immediately fresh at every moment.
Rank #2
Keep request-specific values outside the cached scope
Cookies, headers, and other request-specific values need a clear boundary. Read the request value outside a standard use cache scope, then pass only the value the cached function needs as an argument. Because arguments are part of the cache key, a user-specific input creates distinct cache entries for distinct inputs; it does not make personalized output universally shareable.
Do these 3 things before closing this tab:
1Repair Windows errors before they cause bigger problems2Scan for outdated or missing drivers - takes under a minute3Clear out junk files and repair common Windows errorsIf the result must be computed from request-time information and should not be cached, render it behind Suspense instead. The fallback is available for the prerendered shell, and the request-dependent result fills in at runtime. Keep that boundary close to the content that actually needs the request.
Choose freshness and invalidation deliberately
Match the cache policy to the data’s change pattern and the freshness the page can tolerate. Cache lifetime supports time-based revalidation; tags and revalidation APIs support on-demand invalidation when an application knows that related data has changed. These are different controls: time-based policy bounds the configured staleness behavior, while tag-based invalidation gives application code a way to invalidate tagged results. Consult the directive and rendering guides for the supported APIs and semantics for your Next.js version. use cache reference · Partial Prerendering guide
- Mostly stable, not request-dependent: cache it and select an acceptable lifetime.
- Stable until a known event: use tags and on-demand revalidation where appropriate.
- Depends on the current request: keep it outside the ordinary cached scope and render it behind Suspense.
- Personalized but cacheable: pass the minimum required personalization value as an input, understanding that it partitions cache entries.
What changes when migrating an existing route
With Cache Components enabled, the migration guide replaces parts of the older route-segment configuration model with explicit cache and rendering choices. It says dynamic = 'force-dynamic' is no longer needed in this model, revalidate is replaced by cacheLife, and fetchCache is unnecessary inside a use cache scope. Next.js migration guide: Cache Components
Do not convert every route mechanically. Review what each route reads, which values depend on the incoming request, what freshness each data source requires, and where a Suspense fallback is acceptable. Preserve the intended behavior of request-specific rendering and invalidation as you move to the new model.
When a remote cache handler is relevant
The directive reference also documents use cache: remote for a platform-provided dedicated cache handler. A remote handler introduces a network round trip to check the cache and typically incurs platform fees. That is an operational trade-off, not a guaranteed speed improvement: provider compatibility, deployment setup, cost, and the effect of the added round trip must be assessed for the specific application. The documentation does not establish universal behavior or pricing across providers.
Quick Recap
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
