Route Segment Config Explained: `dynamic`, `revalidate`, `runtime`, and More

The route segment config options you can export from a page, layout, or route handler, and which of them belong to the pre-Cache-Components model.

8 min read

Route segment config is a set of variables you export from a page, layout, or route handler to control how that segment renders and caches. Most of these options belong to the pre-Cache-Components model, and Next.js 16 removes several of them when Cache Components is enabled. The Cache Components era replaces them with new options, so the right choice depends on which model your app runs.

The options at a glance

The main options, their values, and which model they belong to:

OptionValuesModel
dynamicauto, force-dynamic, force-static, errorPre-Cache-Components
revalidatefalse, 0, numberPre-Cache-Components
fetchCacheauto, only-cache, force-cache, and morePre-Cache-Components
dynamicParamsbooleanPre-Cache-Components
runtimenodejs, edge (deprecated)All routes
instanttrue, false, objectCache Components only
prefetchprefetch modesCache Components only

The four rendering options are removed under Cache Components, while runtime still applies everywhere. The deprecated preferredRegion and the platform-driven maxDuration round out the list.

The removal is conditional rather than a deletion from the framework. Turn cacheComponents off and the rendering options work again, which is why so much older Next.js code still runs unchanged.

dynamic

The dynamic export sets the whole segment static or dynamic. It accepts auto, force-dynamic, force-static, and error, with auto as the default. Auto lets Next.js decide from the APIs you use, which is right for most pages.

App.tsxApp.tsx
// app/dashboard/page.tsx
export const dynamic = 'force-dynamic'
 
export default function DashboardPage() {
  return <p>Dashboard</p>
}

The force-dynamic value renders this page per request, even though it reads no request data. Its opposite, force-static, forces prerendering and makes cookies and headers return empty values rather than failing.

The error value is the strict one. It fails the build if anything inside the segment tries to turn dynamic, which makes it a useful guard on a page you intend to keep fully static.

All three are whole-segment switches, so none of them can split one page into static and dynamic parts. That limitation is exactly what Cache Components was built to remove.

revalidate

The revalidate export sets how often a segment regenerates in the background. It is in seconds and must be statically analyzable, so 3600 works but a computed expression such as 60 times 10 does not.

App.tsxApp.tsx
// app/blog/page.tsx
export const revalidate = 3600
 
export default async function BlogPage() {
  const res = await fetch('https://api.example.com/posts')
  const posts = await res.json()
  return <p>{posts.length} posts</p>
}

After an hour, the next request still gets the cached page instantly while a fresh copy regenerates in the background. Set it to false for the default caching heuristic, or to 0 to always render dynamically.

One detail catches people out. The lowest revalidate across a route's layouts and pages wins for the whole route, so a chatty layout can pull a slow-changing page down with it.

This is the older ISR timer, replaced by cacheLife under Cache Components. See Incremental Static Regeneration for both models.

runtime

The runtime export picks the JavaScript runtime. The default is nodejs, and the edge value is deprecated, so remove the export rather than setting it.

typescripttypescript
// app/api/data/route.ts
export const runtime = 'nodejs'
 
export function GET() {
  return Response.json({ ok: true })
}

Since nodejs is already the default, this export is only worth writing while you are removing a deprecated edge one. Cache Components requires the Node.js runtime, which is another reason to delete any that linger.

The maxDuration option sets a per-route timeout. Its default comes from the deployment platform rather than from Next.js, so the ceiling differs between hosts and a value that works on one may be rejected on another.

The Cache Components era options

Two newer exports belong to the Cache Components model rather than the rendering options above. The instant export tells Next.js whether a navigation into this segment should produce an instant UI.

It validates that expectation instead of changing how the route renders, so it surfaces blocking code without altering output. The prefetch export is the other one, and it controls how much of the route a link prefetches.

Both only make sense with Cache Components enabled, and instant throws if you export it from a Client Component. The validation behavior and its levels are covered in the instant route segment config.

The full set of pre-Cache-Components options, including fetchCache and dynamicParams, is covered in caching without Cache Components.

Rune AI

Rune AI

Key Insights

  • Route segment config is exported from page, layout, or route files.
  • dynamic, revalidate, fetchCache, and dynamicParams are pre-Cache-Components.
  • runtime defaults to nodejs, and edge is deprecated.
  • maxDuration is set by the deployment platform.
  • instant and prefetch belong to the Cache Components model.
RunePowered by Rune AI

Frequently Asked Questions

Do route segment config options still work in Next.js 16?

runtime and maxDuration still apply. The rendering options dynamic, dynamicParams, revalidate, and fetchCache are removed when cacheComponents is enabled.

Which options are Cache Components only?

instant and prefetch are Cache Components era options. instant validates instant navigation, and prefetch controls link prefetching behavior.

Conclusion

Route segment config exports control rendering and caching per segment. The rendering options are pre-Cache-Components, runtime and maxDuration still apply everywhere, and the Cache Components era adds instant and prefetch.