What is speculation rules API and prerendering?

Answer

The Speculation Rules API (Chrome 109+) enables full page prerendering — fetching, rendering, and executing a complete page in an invisible background tab before navigation. This enables near-instant page transitions. Define in a script tag: <script type="speculationrules">{"prerender": [{"where": {"href_matches": "/products/*"}, "eagerness": "moderate"}]}</script>. Eagerness levels: conservative: only when user starts hovering. moderate: when user hovers for 200ms. eager: as soon as the link is observed in the viewport. vs prefetch: prefetch only downloads resources. Prerendering fully renders the page — all JS executes, all API calls complete. Navigation feels instantaneous. Considerations: resource intensive — only prerender high-probability next pages. Respect privacy — don't prerender pages with analytics that fire on load. Use HTTP Cache-Control headers to prevent prerendered pages from being stale. Google Search uses it: search results pages are prerendered in mobile Chrome. When combined with good LCP, a prerendered page can achieve sub-100ms perceived load times from click to painted content.