Riccardo

Riccardo

Next.js Pre-loading

Client-side transitions between routes (pages) can be enabled via the Link component.

The Link component accepts a props called prefetch that prefetches the page in the background and that defaults to true. Any <Link /> that is in the viewport (initially or through scroll) will be preloaded.

Prefetch can be disabled by passing prefetch={false}. When prefetch is set to false, prefetching will still occur on hover.

Pages using Static Generation will preload JSON files with the data for faster page transitions.

Prefetching is only enabled in production.