The speed feature that doubled a conversion rate

One eyewear retailer added Speculation Rules to their site and measured a 43% reduction in mobile Largest Contentful Paint and a 101% lift in mobile conversion rate. The implementation is a JSON block in the head of the document. There is no framework migration, no rewrite and no new dependency.

That combination, large commercial result and small technical change, is rare enough that it is worth understanding properly rather than handing to a developer as a ticket.

What it does

Speculation Rules tell the browser which pages a user is likely to visit next, and whether to prefetch them, meaning download the HTML in advance, or prerender them, meaning build the entire page in a hidden tab, run the scripts, load the images, ready to swap in instantly.

When the user clicks a prerendered link, the page does not load. It is already loaded. The navigation is a swap, and LCP is measured from the moment of activation, which is why the number moves so hard.

The rules go in a script tag of type speculationrules, as JSON. You can list explicit URLs, or match by document rules such as every link whose address starts with a given path, and set an eagerness level that decides when the browser acts.

Eagerness is the entire decision

Three settings, and choosing between them is the whole design conversation.

Conservative acts on pointerdown, the moment the user presses. That is roughly a 100ms head start on a click, which is real but modest, and it almost never wastes a fetch because the user has already committed.

Moderate acts after a hover of around 200ms. On desktop this catches most real intent, because people move the cursor to a link and pause before clicking. On touch devices there is no hover, so moderate behaves close to conservative.

Eager acts as soon as the rules are parsed. It is right for a small, known set of high-intent destinations, and wrong as a blanket setting.

The sensible starting configuration for a marketing site is moderate on your primary navigation and eager on the two or three URLs that carry the enquiry, usually the contact page and your highest-converting service page.

What it actually costs

Prerendering is not free, and pretending otherwise is how teams get burned.

Every prerender is a full page load your server serves and the user's device executes. On a page with heavy scripts, that is CPU and battery on a phone, and it is requests on your origin. If you set eager on a category listing with 60 product links, you have just asked the browser to build 60 pages.

Chrome caps how many prerenders it will hold at once, so it degrades rather than melting down, but the wasted work is real. Track your origin request volume for a fortnight after you switch it on.

The second cost is analytics. A prerendered page runs its scripts before the user has arrived, so your tag manager fires, your pageview lands, and your session data is now describing visits that never happened. This is the single most common reason a Speculation Rules rollout gets reverted after the marketing team sees their numbers.

There are two answers. Use the Page Visibility API and the prerenderingchange event to hold analytics until the page is actually activated, which most modern analytics tags support but few implementations have configured. Or use the prerender-until-script mode, which builds the page and stops before any blocking script runs, so nothing fires until activation.

Where it goes wrong

Do not prerender anything with a side effect. A URL that logs out, marks something as read, adds to cart, decrements stock, or triggers an email is not a candidate. If a GET request on your site changes state, prerendering will expose that, and it will look like a bug from nowhere.

Do not prerender behind authentication without testing carefully, because the prerendered page is built with the user's cookies and can go stale before activation.

And do not point rules at pages that redirect. A redirect chain in a prerender wastes the whole speculation.

The order to do this in

1. 1.Pick three destination URLs by conversion value, not by traffic. On most sites that is contact, the top service page and pricing.
2. 2.Fix your analytics handling first, before any rules ship. Confirm in a staging environment that a prerendered page fires nothing until activation.
3. 3.Ship moderate eagerness on your primary nav links only.
4. 4.Watch origin requests and server response times for two weeks.
5. 5.Then add eager on the three URLs from step one.

Measure the outcome as conversion rate by device, not as an LCP number in a report. LCP is how the mechanism works. Conversion rate is why you did it.

Most speed work asks you to remove things people fought to add. This one asks you to add fifteen lines of JSON.