Glossary · Performance

Prefetch (rel=prefetch)

rel=prefetch is a low-priority hint asking the browser to download a resource during idle time because it will likely be needed on a later navigation.

Updated October 6, 2026

Prefetch, written as <link rel="prefetch" href="...">, asks the browser to download a resource at the lowest priority while the network is idle and keep it in cache for a probable future page, not the current one.

Why it matters

If you can predict the next step, such as a checkout page after the cart, prefetching makes that navigation feel instant because the files are already local. Because it runs at idle priority, it should not slow the current page, though it does use the visitor's data, which matters on metered mobile plans.

Example

<link rel="prefetch" href="/checkout.js" as="script">
<link rel="prefetch" href="/next-article.html">

Prefetched responses go into the HTTP cache, so cache headers still apply. A response with Cache-Control: no-store gives no benefit. Frameworks such as Next.js prefetch linked routes automatically when links enter the viewport.

Common mistakes

  • Using it for files the current page needs. That is what preload is for.
  • Prefetching large files on every page regardless of the odds of use.
  • Ignoring data-saver settings; browsers may skip prefetch then.
  • Assuming it is guaranteed. It is a hint the browser can drop.

Get notified when this term updates

Plus occasional practical tips on uptime and monitoring, nothing else. Unsubscribe anytime.

Keep reading

Glossary · PerformanceBrotli CompressionBrotli is a compression algorithm from Google that usually shrinks text assets 15-25 percent more than gzip and is supported by all modern browsers.Glossary · PerformanceCache BustingCache busting changes a file's URL when its content changes, so browsers and CDNs fetch the new version despite long cache lifetimes.Glossary · PerformanceCache StampedeA cache stampede happens when a popular cache entry expires and many requests rebuild it at once, flooding the database or origin behind the cache.Guide · PerformanceHTTP/2 and HTTP/3 Explained: What Changes and How to Enable ThemUnderstand multiplexing, QUIC and head-of-line blocking, when HTTP/2 and HTTP/3 actually help, and how to enable and verify them on nginx and Cloudflare.7 min readGuide · PerformanceImage Optimization Guide: WebP, AVIF, Sizing, srcset, Lazy LoadingChoose between JPEG, PNG, WebP and AVIF, size images correctly, use srcset and lazy loading, and batch convert with cwebp, avifenc and sharp.6 min readGuide · Hosting & CDNCDN Explained: What It Does, When You Need One, and How Caching WorksUnderstand how a content delivery network works, which headers control caching, what origin shield does, when a CDN helps or hurts, and how to verify it is working.7 min read

This page is general information written by our editorial team and updated when documentation changes. Servers and providers differ, so test changes safely first. See our editorial policy and disclaimer.