DFIELDSOLUTIONS

From the archive

LabSpeculation Rules API in 2026: near-instant nav, zero JS

Chromium's Speculation Rules API prerenders the next page before the user clicks. Real INP / LCP numbers, a production-safe config, and the one gotcha we hit.

From the archive4 sections · 2 min readBy Dezső Mező · Published .mdWebPerformanceCWVChromiumSEO

The Speculation Rules API is probably the biggest quiet win of 2024-26 web performance. Add a small JSON block to your HTML, Chromium prerenders the next-likely page. When the user clicks, the navigation is near-instant. And it costs zero JS bundle size.

01What it does

Two modes: 'prerender' (full render into a hidden tab) and 'prefetch' (fetch only). Prerender is more aggressive · the page is live when clicked. Prefetch is cheaper · the HTML is warm but needs to render on activation.

02The config we ship

<script type='speculationrules'>
{
  'prerender': [{
    'source': 'document',
    'where': { 'href_matches': '/*' },
    'eagerness': 'moderate'
  }],
  'prefetch': [{
    'source': 'list',
    'urls': ['/blog', '/services', '/projects']
  }]
}
</script>

Eagerness 'moderate' triggers on hover (200ms pre-click). 'Eager' triggers immediately on list. 'Conservative' only on mouse-down. Moderate is the right default · it feels instant without blowing the per-origin prerender budget.

03Real numbers

  • Nav LCP · 1.2s -> 0.05s on prerendered target.
  • Nav INP · 180ms -> 35ms.
  • Prerender-hit rate in production · ~75% on moderate eagerness.

04One gotcha

Prerender runs client-side JS immediately · including analytics. GA4, Segment, and Amplitude all dedupe, but some older trackers double-count. Add the 'prerendering' check to your analytics init if you use anything custom.

Ship it. 20 lines of config, 200ms-600ms INP win on nav, 0 JS bundle cost. We now default to this on every Next.js site we build.

What to take away

  • The Speculation Rules API (Chromium) prerenders navigation targets on hover or list. Near-instant nav, measurable LCP / INP win, zero JS-bundle cost. The production-safe config we default to, the one gotcha worth knowing.
We build this for clientsWeb performance

More from the lab

Browse all entries

Want this looked at on your own system?Start a conversation

5.0
“New shop, more orders in the first week.”Müller Márk · GeekCornerManaging Director · Hungary