Skip to content

Speculation Rules API

Spicy — senior dev territoryFrontend

ELI5 - The Vibe Check

The Speculation Rules API lets you tell the browser hey, the user will probably click this link next, go ahead and prerender it now. By the time they actually click, the page is already loaded and ready, making navigation feel instant. It's basically prefetching's more ambitious sibling that renders the whole page, not just the resource.

Real Talk

The Speculation Rules API is a browser API that lets sites declare rules for prefetching or prerendering same origin pages likely to be visited next, replacing the older link rel=prerender mechanism. Rules can target specific URLs or use document level heuristics, and prerendered pages activate instantly on navigation since rendering already happened in a hidden background frame.

Show Me The Code

<script type="speculationrules">
{
  "prerender": [{
    "where": { "href_matches": "/products/*" },
    "eagerness": "moderate"
  }]
}
</script>

When You'll Hear This

"We added speculation rules for our product pages and navigation feels instant now." / "Be careful what you prerender, speculation rules can fire analytics events before the user actually visits."

Made with passive-aggressive love by manoga.digital. Powered by Claude.