WordPress has released an official plugin that introduces support for a cutting-edge technology called speculative loading, which can significantly enhance site performance and user experience for visitors.
### Speculative Loading
Rendering involves constructing the entire webpage so that it displays instantly. When your browser downloads the HTML, images, and other resources and assembles them into a webpage, that process is known as rendering. Prerendering, on the other hand, involves putting that webpage together in the background.
This plugin enables the browser to prerender an entire webpage that a user might navigate to next. It anticipates which webpage the user might visit based on where they are hovering.
Chrome prefers prerendering only when there is at least an 80% probability that a user will navigate to another webpage. According to Chrome’s guidelines:
> “Pages should only be prerendered when there is a high probability the page will be loaded by the user. This is why the Chrome address bar prerendering options only happen when there is such a high probability (greater than 80% of the time).”
There is a caveat, as prerendering may not occur based on user settings, memory usage, and other scenarios.
The Speculative Loading API addresses a problem that previous solutions could not, as they merely fetched resources like JavaScript and CSS without actually prerendering the entire webpage.
> “Introducing the Speculation Rules API
> The Speculation Rules API is a new web API that solves the above problems. It allows defining rules to dynamically prefetch and/or prerender URLs of a certain structure based on user interaction, in JSON syntax—or in other words, speculatively preload those URLs before navigation. This API can be used, for example, to prerender any links on a page whenever the user hovers over them.”
The official WordPress announcement further elaborates on this:
> “The Speculation Rules API is a new web API… It allows defining rules to dynamically prefetch and/or prerender URLs of a certain structure based on user interaction, in JSON syntax—or in other words, speculatively preload those URLs before navigation.
>
> This API can be used to prerender any links on a page whenever the user hovers over them. With the Speculation Rules API, “prerender” means prerendering the entire page, including running JavaScript. This can result in near-instant load times once the user clicks on the link, as the page would likely have already been fully loaded. However, that is just one of the possible configurations.”
The new WordPress plugin enhances support for the Speculation Rules API. This API targets document URLs rather than specific resource files, making it more suitable for multi-page applications (MPAs) rather than single-page applications (SPAs). It provides many improvements over existing technologies, along with a more expressive, configurable syntax for specifying which documents should be prefetched or prerendered.
### Performance Lab Plugin
Developed by the official WordPress performance team, this new plugin is set to prerender “WordPress frontend URLs” such as pages, posts, and archive pages by default. The settings can be fine-tuned under:
Settings > Reading > Speculative Loading
### Browser Compatibility
The Speculative API is supported by Chrome 108, but the specific rules used by the new plugin require Chrome 121 or higher, which was released in early 2024. Browsers that do not support this feature will simply ignore the plugin, and it will not affect the user experience.
### How Analytics Handles Prerendering
A WordPress developer raised a question about how analytics would handle prerendering. It was clarified that analytics providers need to detect a prerender and not count it as a page load or site visit. Both Google Analytics and Google Publisher Tags have provisions to handle prerenders:
> “Google Analytics handles prerendering by delaying until activation by default as of September 2023, and Google Publisher Tag (GPT) made a similar change to delay triggering advertisements until activation as of November 2023.”
### Possible Conflict With Ad Blocker Extensions
There are a few things to be aware of about this plugin. Apart from being an experimental feature requiring Chrome 121 or higher, it may not work with browsers using the uBlock Origin ad blocking extension.
### Conclusion
Overall, this new plugin by the WordPress Performance Team is a great opportunity for users to try out new performance technologies. Check out the new Speculative Loading WordPress plugin and explore the potential improvements in site performance and user experience.
