The `instant` Route Segment Config in Next.js 16

The instant route segment config tells Next.js whether navigation into a segment should produce an instant UI. It answers one question: does navigating into this segment render without waiting on external data? It is a Cache Components feature, so it only works when cacheComponents is enabled, and its checks surface in the dev overlay rather than at build time.

What instant validates

Next.js prefetches links to make navigation feel instant, but client-side fetching or partially prerendered results can still make a navigation wait. When a segment opts in with instant, Next.js flags any code that would block that navigation from updating immediately. The point is to catch blocking reads while you are still developing, instead of discovering slow navigations in production.

App.tsx

// app/tabs/[tab]/page.tsx
export const instant = true
 
export default function Page() {
  return <p>Tab</p>
}

With instant set to true, opening this tab should render without waiting on external data. If something in the tree blocks it, the dev overlay names the component, and the fix is usually to cache the data or wrap it in Suspense. Prefetching is disabled in development, so the validation reflects what happens under next start, where prefetching is enabled.

The three forms

The export accepts true, false, or an object with a level option.

• true validates at the globally configured level.
• false opts the segment out and allows it to block.
• An object opts in with options, the only one being level.

App.tsx

// app/page.tsx
export const instant = {
  level: 'warning',
}

The only level available today is warning, which runs in development and leaves the build unaffected. Use the object form when you want to pin the level explicitly instead of inheriting the global default.

Disabling instant

Set false when a segment is allowed to block. This matters when a deeper page should be instant but an ancestor cannot be, because a false higher in the tree takes precedence for the static shell check. A shared layout that cannot load instantly is the classic case, with the deeper pages still marked instant.

App.tsx

// app/tabs/layout.tsx
export const instant = false

Place the false as low as possible, only as high as needed, so the rest of the app keeps validating.

Configuring validation defaults

By default every page and default segment is validated in development at the warning level. Set experimental.instantInsights.validationLevel to manual-warning to validate only segments that opt in explicitly, which is quieter for large apps. When validation fails, the fix is structural: cache the blocking data with use cache, or move it behind a Suspense boundary.

For the static shell and streaming model that instant validates, see how Partial Prerendering works. For the other options you can export from a page or layout, see route segment config explained.