Use the Speculation Rules API to prefetch and prerender navigations
SkillDev toolsSpeculation-rules is a skill for AI agents that guides them through using the Speculation Rules API to prefetch and prerender likely next pages. It helps reduce navigation latency and INP on multi-page sites by writing scoped rules that load or render the next page before the user clicks.
Available today. Use it from your connected AI after setup.
No other account needed.
Have an agent with skills support and access to the skill files.
Then ask your AI: use the Use the Speculation Rules API to prefetch and prerender navigations skill
What your AI can do with it
- Add a Speculation Rules JSON block targeting likely next-page links
- Write prefetch rules that load the next page's HTML ahead of time
- Write prerender rules that render the next page in the background
- Scope rules with href-matches or CSS selector patterns to limit bandwidth use
- Review rule selectors for over-eagerness, flagging unrelated or authenticated pages
- Explain how the API differs from rel=prefetch and rel=prerender
Getting started
- Have an agent with skills support and access to the skill files.
- Add the speculation-rules skill to the agent's available skills.
- Ask the agent to check whether a site uses prefetch or prerender for likely navigation targets.
- Have the agent add a Speculation Rules JSON block, starting with prefetch and graduating to prerender.
- Consult references/rule.md for implementation details, code examples, and framework-specific guidance.
What this skill tells your AI
The instructions your AI receives, as published by thedaviddias/front-end-checklist in skills/speculation-rules/SKILL.md and read by ahel’s review.
Navigation latency is one of the biggest contributors to poor Interaction to Next Paint (INP) and overall perceived performance. Prerendering the most likely next page eliminates all network and rendering latency — the user sees the new page in under 100 ms regardless of server response time. Google Search has used this API to deliver its "instant" results page experience.
Quick Reference
- Use prefetch rules to load the next page's HTML ahead of time
- Use prerender rules to fully render the next page in the background (instant navigation)
- Scope rules with href-matches or CSS selector patterns to avoid wasting bandwidth
- Prefer document rules (CSS selectors) over URL list rules for dynamic sites
Check
Check whether the site uses the Speculation Rules API or equivalent prefetch/prerender techniques for likely navigation targets.
Fix
Add a Speculation Rules JSON block targeting the most likely next-page links, starting with prefetch and graduating to prerender.
Explain
Explain how the Speculation Rules API differs from rel=prefetch and rel=prerender, and how prerendering achieves near-zero navigation latency.
Code Review
Review speculation rule selectors for over-eagerness — flag patterns that would prerender unrelated pages, third-party URLs, or pages with personalised/authenticated content that should not be pre-fetched.
For full implementation details, code examples, and framework-specific guidance,
see references/rule.md.
Rule page: https://frontendchecklist.io/en/rules/performance/speculation-rules
Signals
- GitHub stars
- 74k
- Forks
- 7k
- Last commit
- Aug 2026
Questions
- What does the skill help with?
- Optimising multi-page navigation performance, reducing INP on page transitions, and implementing progressive enhancement for fast page loads using the Speculation Rules API.
- How fast can prerendering make navigation feel?
- Prerendering the most likely next page eliminates network and rendering latency, so the new page appears in under 100 ms regardless of server response time.
Advanced
- Item type
- skill
- Key
speculation-rules- Source
- github.com/thedaviddias/front-end-checklist