---
title: Adopting Partial Prefetching
description: "Learn how to enable Partial Prefetching and what changes for `<Link>`."
url: "https://nextjs.org/docs/app/guides/adopting-partial-prefetching"
docs_index: /docs/llms.txt
version: 16.3.0-canary.75
lastUpdated: 2026-06-24
prerequisites:
  - "Guides: /docs/app/guides"
related:
  - app/guides/instant-navigation
  - app/guides/runtime-prefetching
  - app/api-reference/components/link
  - app/api-reference/config/next-config-js/partialPrefetching
---


> For an index of all Next.js documentation, see [/docs/llms.txt](/docs/llms.txt).
[Partial Prefetching](/docs/app/glossary#partial-prefetching) changes what `<Link>` downloads for a Cache Components route. By default, a `<Link>` loads a per-route [App Shell](/docs/app/glossary#app-shell), and the page's cached content is downloaded only when the link sets `prefetch={true}`. This is the biggest change from the pre-Cache Components behavior, where fully static pages were always prefetched by default.

`<Link prefetch={true}>` also stops prefetching dynamic content. It now only prefetches the cached parts of the page, so the link no longer pulls cookies, headers, or other request-time data ahead of the navigation.

> **Good to know**: Partial Prefetching only works when [`cacheComponents`](/docs/app/api-reference/config/next-config-js/cacheComponents) is enabled.

## What changes for `<Link>`

| `<Link>` prop                       | Before (Cache Components default)                              | After Partial Prefetching                            |
| ----------------------------------- | -------------------------------------------------------------- | ---------------------------------------------------- |
| `<Link href="/x">`                  | Prefetched the cached page render.                             | Loads the App Shell for `/x`.                        |
| `<Link href="/x" prefetch>`         | Prefetched the cached page render **and** any dynamic content. | Loads the App Shell **and** the cached page content. |
| `<Link href="/x" prefetch={false}>` | Disabled prefetching for this link.                            | Unchanged. Still disabled.                           |

The App Shell is shared across every link to a given route, regardless of dynamic params, so rendering many `<Link>`s to the same destination doesn't multiply the work.

## Adopting in a new project

Enable [`partialPrefetching`](/docs/app/api-reference/config/next-config-js/partialPrefetching) in `next.config.ts` alongside Cache Components:

```ts filename="next.config.ts" highlight={5}
import type { NextConfig } from 'next'

const nextConfig: NextConfig = {
  cacheComponents: true,
  partialPrefetching: true,
}

export default nextConfig
```

Add `prefetch` to any `<Link>` whose destination's cached content is worth shipping ahead of the navigation. Leave it off for the rest:

```tsx filename="app/page.tsx"
import Link from 'next/link'

export default function Page() {
  return (
    <nav>
      <Link href="/products">Products</Link>
      <Link href="/checkout" prefetch>
        Checkout
      </Link>
    </nav>
  )
}
```

## Adopting incrementally in an existing project

If you can't enable `partialPrefetching` for the entire app at once, opt routes in one at a time with the [`prefetch`](/docs/app/api-reference/file-conventions/route-segment-config/prefetch) route segment config:

```tsx filename="app/products/[slug]/page.tsx"
export const prefetch = 'partial'

export default function Page() {
  return <div>...</div>
}
```

A `<Link>` pointing at a route with `prefetch = 'partial'` loads the App Shell only, even when `partialPrefetching` is not set in `next.config.ts`.

> **Good to know**: Adopting per-route first also preserves the dev-only `<Link prefetch={true}>` warning, which points at `<Link prefetch={true}>` calls whose destinations haven't adopted yet. Enabling the global flag first marks every route as adopted, which silences the warning and removes the signal for the [audit below](#auditing-existing-link-prefetchtrue-calls).

Once every route in scope has `prefetch = 'partial'`, enable the config and remove the per-route exports:

```ts filename="next.config.ts" highlight={5}
import type { NextConfig } from 'next'

const nextConfig: NextConfig = {
  cacheComponents: true,
  partialPrefetching: true,
}

export default nextConfig
```

## Auditing existing `<Link prefetch={true}>` calls

When `partialPrefetching` is enabled, `<Link prefetch={true}>` now prefetches the App Shell plus cached content, but not dynamic data. Review each existing usage and decide whether the prop is still providing value. In [`next dev`](/docs/app/api-reference/cli/next#next-dev-options), the dev overlay surfaces a [**link-prefetch-partial** insight](/docs/messages/instant-link-prefetch-partial) for each call that points at a route without Partial Prefetching, so you can work through them one at a time.

Previously, `<Link prefetch={true}>` also prefetched dynamic data.

| Destination                                                                                 | Recommendation                                                                                                                                                                       |
| ------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| Fully static (no `"use cache"`, no Suspense)                                                | Drop `prefetch={true}`. The default `<Link>` already loads the full page because the App Shell is the page.                                                                          |
| Has cached content worth shipping ahead of the click                                        | Keep `prefetch={true}`. The cached parts come with the App Shell.                                                                                                                    |
| Reads request data (`cookies()`, `headers()`, `searchParams`) the user will need on arrival | Keep `prefetch={true}`. Optionally enhance it with [runtime prefetching](/docs/app/guides/runtime-prefetching) (`prefetch = 'allow-runtime'`) so the request data is prefetched too. |

> **Good to know**: `prefetch = 'allow-runtime'` is an *enhancement* that adds runtime prefetching of request data. It is not a way to silence the dev `<Link prefetch={true}>` warning. That warning means the link does a legacy full prefetch of a route that hasn't adopted Partial Prefetching. The per-route opt-in for Partial Prefetching is `prefetch = 'partial'`, which is separate from `'allow-runtime'`.

Before:

```tsx filename="app/nav.tsx"
<Link href="/about" prefetch={true}>About</Link>           {/* static page */}
<Link href="/products" prefetch={true}>Products</Link>      {/* cached list */}
<Link href="/dashboard" prefetch={true}>Dashboard</Link>    {/* reads cookies */}
```

After:

```tsx filename="app/nav.tsx"
<Link href="/about">About</Link>                            {/* default is enough */}
<Link href="/products" prefetch={true}>Products</Link>       {/* unchanged */}
<Link href="/dashboard" prefetch={true}>Dashboard</Link>     {/* and add `prefetch = 'allow-runtime'` to /dashboard */}
```

## Next steps

* [Runtime prefetching](/docs/app/guides/runtime-prefetching) for per-link runtime prefetches and App Shells in depth.
* [`partialPrefetching` API reference](/docs/app/api-reference/config/next-config-js/partialPrefetching) for the global config flag.
* [`prefetch` API reference](/docs/app/api-reference/file-conventions/route-segment-config/prefetch) for the per-segment prefetch config.
* [`<Link>` API reference](/docs/app/api-reference/components/link#prefetch) for the per-link `prefetch` prop.
* [Instant navigation](/docs/app/guides/instant-navigation) to validate that the routes you've marked actually navigate instantly.
## Next Steps

Learn more about prefetching and instant navigations.

- [Instant navigation](/docs/app/guides/instant-navigation)
  - Learn how to structure your app to prefetch and prerender more content, providing instant page loads and client navigations.
- [Runtime prefetching](/docs/app/guides/runtime-prefetching)
  - Extend the App Shell with personalized content using the prefetch segment config and per-session caching directives.
- [Link Component](/docs/app/api-reference/components/link)
  - Enable fast client-side navigation with the built-in `next/link` component.
- [partialPrefetching](/docs/app/api-reference/config/next-config-js/partialPrefetching)
  - Configure the default link prefetch behavior to fetch only the static parts of each route.

---

For a semantic overview of all documentation, see [/docs/sitemap.md](/docs/sitemap.md)

For an index of all available documentation, see [/docs/llms.txt](/docs/llms.txt)