Speculation Rules API for prefetching and prerendering

The Speculation Rules API lets a page tell the browser which pages to prefetch or prerender before the user clicks, so navigation to a likely next page feels instant. It improves on the old <link rel="prefetch"> hints, which downloaded HTML but did not render it, and on the removed <link rel="prerender">.

Choose an eagerness

• Prerender. Fully loads the next page in a hidden tab, including running its JavaScript and fetching subresources. When the user clicks, the page appears immediately. This is heavier on memory and bandwidth, so use it for the single most likely next step.
• Prefetch. Downloads only the next page's HTML in the background without executing it. Lighter weight and a good default for a family of likely next pages.
• Eagerness settings. Chromium's eagerness control lets you scale from conservative (e.g. on a pointer or keyboard interaction) to moderate (near a click) to eager (load as soon as considered). Pick the smallest that captures the user's intent to avoid wasted bytes.

Write the rules

Rules are JSON inside a <script type="speculationrules"> block:

<script type="speculationrules">
{
  "prerender": [
    { "where": "href_matches", "hrefs": ["/shop"], "eagerness": "eager" }
  ],
  "prefetch": [
    { "where": "href_matches", "hrefs": ["/p/*"], "eagerness": "moderate" }
  ]
}
</script>

• hrefs with exact URLs or where with href_matches and a URL pattern scope the rules to specific links. Browsers ignore unknown keys, so rules degrade safely where unsupported.
• You can also deliver rules via a header. The Speculation-Rules: <url> HTTP response header points the browser at a JSON file, useful for CDN-driven sites.
• Same-origin by default. Prerendering is limited to same-origin documents unless the target opts in with the Supports-Loading-Mode: credentialed-prerender header for same-site, cross-origin prerender.

Verify and fall back

• Check support. Feature-detect with HTMLScriptElement.supports('speculationrules'). Unsupported browsers ignore the script block, so the rules are a safe progressive enhancement.
• Only Chromium today. Chrome and Edge support the API; Safari (disabled by default in recent versions) and Firefox currently ignore it, so most users benefit but not all.
• Watch memory on eager prerender. Prerender runs full pages, so only prerender pages you expect to be visited and that are not analytics-heavy on load.
• Avoid prerendering privileged or stateful pages. A checkout or login page that sets cookies or mutates server state should be prefetched (or not speculated at all) rather than prerendered, to avoid side effects.
• Confirm in DevTools. Under Application > Background Services > Speculation Rules you can see which URLs were speculated, triggered, or skipped, which tells you whether your eagerness is firing.