Next.js Navigation

Expert guidance for Next.js App Router navigation patterns, prefetching behavior, and navigation-specific optimizations.

Link Prefetching Behavior

Prefetch behavior differs significantly between App Router and previous Next.js versions:

App Router Prefetch Props

• prefetch={false} - Disables all prefetching, including on hover. In previous Next.js versions, this would still prefetch on hover.
• prefetch={undefined} - Prefetches static routes only. Dynamic routes are not prefetched.
• prefetch={true} - Prefetches both static and dynamic routes.

Example:

// No prefetching at all
<Link href="/dashboard" prefetch={false}>Dashboard</Link>