Skip to content
AI Primer
release

Next.js 16.4 enables Cache Components by default in new apps

Next.js 16.4 made Cache Components the default for new apps and added APIs for static output and partial navigation rendering. The release also adds agent-guided upgrades and cuts Turbopack disk-cache size by 20–25%.

4 min read
Next.js 16.4 enables Cache Components by default in new apps
Next.js 16.4 enables Cache Components by default in new apps

TL;DR

  • Next.js 16.4 makes Cache Components the recommended model for every app and enables it in new create-next-app projects, according to nextjs's release summary and nextjs's default announcement.
  • Static rendering gets explicit enforcement levels for the shell, prefetch, or complete navigation: nextjs's ensureStatic post names all three.
  • Prefetching becomes staged, with navigation() able to defer expensive content until a user navigation, as nextjs's navigation API post describes.
  • Existing projects get an agent-assisted migration command that supplies version-specific guides, codemods, and verification steps, according to nextjs's upgrade command.
  • Turbopack reports a 20–25% smaller disk cache alongside smaller bundles and more targeted bundle analysis, per nextjs's Turbopack update.

The official release pairs a new rendering default with a CLI that can perform the migration. The static-pages guide turns static output into three enforceable navigation stages, while a hands-on migration report puts numbers on the difference between enabling the model and actually classifying components for caching.

Cache Components

The most consequential change is the default programming model. Next.js describes Cache Components as component-level, composable caching built around 'use cache', allowing cached UI, request-time rendering, and client-side caching to coexist in one route, as the release post explains.

New apps created with create-next-app enable Cache Components automatically in 16.4. The framework recommends the model for every Next.js application now and says it will become the default in Next.js 17, while existing applications still need a migration path.

Ahmet Zeybek, writing after migrating two applications, found that enabling Cache Components alone changed nothing on a dynamic dashboard. After classifying individual widgets, five of twelve became cached and typical server time fell from about 900 ms to about 180 ms, according to his migration report.

Static output

ensureStatic adds build-time guardrails to the mixed static and dynamic model. The official guide defines three levels:

  • shell: the App Shell loaded by a default link prefetch.
  • prefetch: the shell plus per-link content, including URL data such as params.
  • navigation: the complete route response after the user navigates.

A route using ensureStatic = 'navigation' fails the build when dynamic content enters the route, according to Next.js's release documentation. The same export can live on a layout, extending the guarantee across its child routes.

The new navigation() API lets a component exclude cached content from a prefetch and wait until the actual navigation, which nextjs's navigation API post describes. The companion prefetch() API excludes content from the initial shell until an explicit prefetch occurs, giving routes separate stages for shell, link, and navigation work.

Agent workflow

Next.js 16.4 gives existing apps a migration command instead of a generic version bump. npx next@canary upgrade --agent=latest checks the installed version, selects a target release, prepares migration guides and codemods, then supplies verification steps for the coding agent, according to the official release.

The release also adds experimental.agentUpgrade, which can surface upgrade reminders during next dev or next build. Its documented policies are security, latest, or false, covering security updates, newer major or minor versions, or disabled reminders.

Agent feedback is a separate experimental workflow. It drafts reports about framework errors, unclear documentation, or workarounds for human review before submission, as nextjs's agent feedback post says. A separate mattpocockuk's link points to The AI Coding Dictionary, described in the linked metadata as a plain-English glossary for AI coding terms.

Turbopack

Turbopack now does less work in development and emits smaller output. The release reports a 20–25% smaller disk cache, server updates compiled only when needed, and smaller production bundles, while nextjs's Turbopack update adds that experimental paths can load imports on demand, remove stale cache data, and run plugins in worker threads.

The Turbopack Bundle Analyzer also gained a route summary for large client routes, snapshot diffs for comparing analyses over time, and filters for modules on the critical render path. nextjs's bundle analyzer update ties those views to the next-bundle-optimizer Skill, which can guide an agent through reducing what reaches the browser.

React 19.3

Next.js 16.4 includes React 19.3, which makes View Transitions and Fragment Refs stable. The React 19.3 announcement describes View Transitions as handling elements that enter, exit, move, or resize during marked transitions.

The bundled React release also adds the browser() API and Trusted Types support, features listed in nextjs's React 19.3 note. View Transitions can be customized with CSS classes or the Web Animations API, while React's own announcement says updates outside a Transition remain immediate rather than animated.

Further reading

Discussion across the web

Where this story is being discussed, in original context.

On X· 4 threads
TL;DR1 post
Static output1 post
Agent workflow2 posts
Turbopack1 post
Share on X