The new Prerender Until Script Speculation Rule

Origin Trial Status: This feature is currently an Origin Trial. To implement it, you must register for an Origin Trial token or enable it locally via chrome://flags. Despite its experimental nature, early feedback from the engineering community indicates exceptional stability and  performance improvements.

Prerender Until Script: The new mode for Speculative Loading

Latency is the bottleneck. I have said this for years, and it remains the single biggest problem in web performance. No matter how much we optimize our Critical Rendering Path or shave kilobytes off our bundles, we are ultimately bound by the laws of physics and the round-trip time (RTT) of the network.

For a long time, we’ve tried to cheat these laws using Speculative Loading: guessing where the user will go next and loading it beforehand. Until now, we’ve had two main tools, and neither was perfect:

• prefetch: Safe and lightweight, but it only fetches the HTML. The browser still has to parse, build the DOM, and discover subresources (CSS, images) after the user clicks. It solves the network wait, but not the rendering work.
• prerender: The nuclear option. It loads everything, executes JavaScript, and renders the page in a hidden background tab. It is instant, but it is expensive. It eats bandwidth, consumes memory, and worst of all, it triggers "side effects", firing analytics pixels and executing code for pages the user might never actually see.

We obviously needed a middle ground. We needed the visual readiness of a prerender without the computational cost and risk of executing application logic.

prerender_until_script.

The brilliance of prerender_until_script lies in how it decouples parsing from execution.When you utilize this specific Speculation Rule, you are instructing the browser to:

• Fetch the document (like a prefetch).
• Parse the HTML stream and construct the DOM.
• Run the Preload Scanner. This is the critical part. The browser discovers and downloads subresources like high-priority CSS and the LCP image.

However, the moment the parser encounters a JavaScript execution point 2 things might happen:

• Synchronous Scripts: The parser halts immediately.
• Async/Defer Scripts: They are downloaded and queued, but not executed.

The browser builds the visual "shell" of the page: The layout, the typography, the images—but leaves the application logic frozen. The page sits in memory, chemically stable, waiting for the user to click.

When the click happens, the page is swapped in instantly, and the "paused" state is lifted. The JavaScript executes, the event handlers attach, and your analytics fire exactly when they should.

The Implementation

We implement this using the Speculation Rules API. Because prerender_until_script is an experimental feature (landing in Chrome 144), we must ensure backward compatibility.

Browsers that do not recognize the prerender_until_script key will ignore it. Therefore, a responsible implementation defines a prefetch fallback for the same set of URLs. Chrome will automatically deduplicate these rules and apply the most capable action available.

Here is the JSON structure for a production-ready implementation::

<script type="speculationrules">
{
  "prerender_until_script": [
    {
      "source": "document",
      "where": {
        "and": [
          { "href_matches": "/*" },
          { "not": { "href_matches": "/logout" } },
          { "not": { "href_matches": "/cart" } }
        ]
      },
      "eagerness": "moderate"
    }
  ]
}
</script>

Tip: if you quickly want to generate your own custom set of spculatoin rules you can use the speculation rules generator

Considerations

Eagerness: I almost exclusively recommend moderate. This triggers the speculation on hover (specifically, when the pointer lingers for 200ms). immediate is too aggressive for most implementations and risks wasting user bandwidth on mobile connections.

Exclusions: You must be disciplined here. Never speculate on state-changing URLs like /logout or /add-to-cart. While prerender_until_script protects against script execution, good architecture dictates we shouldn't even fetch these endpoints unnecessarily.

Weakness (Parser Blocking): The parser halts immediately upon encountering a synchronous <script> tag. This nullifies enhancements like <script>loadWhileIdle(chat.js)</script> if they appear early in the DOM. You might need to refactor existing code to place these scripts at the bottom of the page.

Inline Handlers: Note that prerender_until_script only pauses <script> elements. Inline event handlers on other elements (e.g., <img onload="track()">) will still execute if the parser reaches them before a blocking script. Ensure your analytics pixels and tracking logic are not triggered by these inline handlers during the speculation phase.