Speculative Loading in WordPress

The WordPress Performance Team recently published a new plugin called “Speculative Loading” which enables a new technology of the same name to automatically prerender certain URLs on the page, which can lead to near-instant page load times. The functionality is powered by the Speculation Rules API, a new web API that allows defining rules for which kinds of URLs to prefetch or prerender.
Please install and test the plugin to provide feedback to inform further improvements before a potential consideration to include such a feature in WordPress core. You can install the plugin by searching “speculative loading” in WP Admin, or via the Performance Lab plugin.
A brief history of prefetch and prerender in WordPress
WordPress core has for several years provided a simple Resource Hints API which allows injecting tags into the HTML document that can be used to prefetch or prerender certain resources, among other actions. While prefetching can be useful for certain sub-resources of an HTML document, such as third-party script providers, prerendering goes as far as processing the resource and already performing some rendering offscreen and thus can be useful for entire web pages.
However, using the approach of injecting link[rel="prefetch|prerender"]
tags is not very flexible, as the URLs to prefetch or prerender need to be defined as soon as the HTML is loaded. Providing a tag for every potential anchor link a user may click on the page would be wasteful, while not providing any misses a great opportunity for performance optimization. So far, solutions like Quicklink could be used to dynamically insert
tags to prefetch resources in the user’s viewport, which is more flexible, but still far from ideal as it may still excessively prefetch too many resources and requires a JavaScript library.
More importantly though, link[rel="prerender"]
does not actually support prerendering, as the “prerender” value is in fact used for something called NoState Prefetch, which means it is still only prefetching certain resources rather than prerendering them, which for instance would include running JavaScript. Last but not least, the “prerender” value is deprecated at this point.
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 certain structure based on user interaction, in JSON syntax—or in other words, speculatively preload those URLs before the navigation. This API can be used, for example, to prerender any links on a page whenever the user hovers over them. Also, with the Speculation Rules API, “prerender” actually means to prerender the entire page, including running JavaScript. This can lead to near-instant load times once the user clicks on the link as the page would have most likely already been loaded in its entirety. However that is only one of the possible configurations.
The following code example shows the general syntax of the Speculation Rules API JSON spec and outlines a configuration where any links other than WP Admin or login URLs are prerendered.
The Speculation Rules API allows defining URL patterns for which kind of URLs should be eligible for speculative loading. Rules can be configured to either prefetch or prerender certain URL patterns. A so-called “eagerness” value can also be specified which dictates how eagerly the prefetching or prerendering should be applied. For example, a value of “moderate” triggers the speculative loading when the user hovers over the link. A value of “conservative” delays this until the user clicks on the link (which still provides a decent performance benefit), while a value of “eager” acts as soon as there is the slightest suggestion a user may click the link. Note that caution is advised with the “eager” configuration in particular as it increases the likelihood of loading URLs wastefully.
Browser support
While the Speculation Rules API has been available in Chrome and Edge since version 109 in general, the particular subfeature needed to unlock the aforementioned functionality is called “document rules”, which was only recently added in version 121. This post describes the latest enhancements to the API in more depth.
In other words, at the time of writing this post end users will need to use either Chrome 121+ or Edge 121+ to get the benefits of this feature. However there are no adverse effects for users on other browsers, as this is a progressive enhancement. Therefore using the Speculation Rules API on your website is safe regardless of the user base.
The Speculation Rules API was presented at the W3C web standards conference TPAC 2023, with positive reception. At this point, the standard is in draft stage. Positions regarding the API by Firefox and Safari have been requested. To keep track of specifically the required subfeatures for the functionality outlined in this post, you can refer to this “Can I use” table.
The Speculative Loading WordPress plugin
As mentioned in the beginning of this post, the WordPress Performance Team recently published a new feature plugin “Speculative Loading” which enables speculative loading of other frontend URLs linked on the page. It inserts a JSON script similar to the previous code example. By default, any URLs linked on the page are prerendered with an eagerness configuration of “moderate”, which typically triggers when hovering over a link or focusing on it. As such, you don’t need to do anything after activating the plugin: it just works out of the box. The plugin also provides a few customization options to tweak the behavior to the site owner’s preference.
The default behavior can be modified via a new “Speculative Loading” section in the Settings > Reading screen. For example, if the site is using JavaScript that is not yet adapted for being loaded while prerendering, the plugin could be configured to only prefetch documents. One could set the eagerness to “conservative” to reduce the likelihood of URLs being loaded without the user navigating to them. Or one could set it to “eager” to increase the chance of the speculative loading already being completed by the time the user lands on the linked URL, which however runs at the risk of wastefully loading several resources. The default of “moderate” strikes a good balance between sustainability and performance.
The rules for which kinds of URLs to speculatively preload can be customized using a filter called “plsr_speculation_rules_href_exclude_paths”. For example, plugins that add URLs to a WordPress site which modify user state just from being loaded could use that filter to exclude those URLs from being prerendered or prefetched.
Here is a code example which would would ensure that URLs like https://example.com/cart/
or https://example.com/cart/foo/
would be excluded from prefetching and prerendering:
Please refer to the plugin’s FAQ for details on the filter.
Potential next steps
At the moment, the plugin should be used to test the feature, and the Performance Team is eager to receive feedback as well as analyze the plugin’s performance benefits on load times.
Down the road, as the browser API and the plugin mature, the possibility of including the feature in WordPress core will be explored. However, in order to get there, additional feedback is needed.
Testing and feedback
Your testing and feedback is crucial to improve the feature ahead of exploring its potential usage in WordPress core. Please consider the following ways to help:
- Install and activate the Speculative Loading plugin on your site, via WP Admin or the Performance Lab plugin. That alone can go a long way.
- Try different configurations via the “Speculative Loading” section under Settings > Reading.
- Debug how the rules added by the plugin trigger speculative loading to understand the feature better and find potential bugs. Refer to ”Debugging speculation rules”.
- Report feedback (what works well, what does not) or bugs in the GitHub repository or in the plugin’s support forums.
- Integrate your plugins with the “plsr_speculation_rules_href_exclude_paths” filter to exclude certain URLs from prefetching and/or prerendering, if you develop plugins that add interactive or dynamic content to a WordPress site’s frontend.
The WordPress performance team is excited to learn more about how the Speculation Rules API is being used in WordPress sites. Please try the plugin and share your feedback!
Props @adamsilverstein @domenicdenicola @jeremyroman @swissspidy @tunetheweb @tweetythierry @westonruter for review and proofreading.
nnnn
A brief history of prefetch and prerender in WordPress
nnnn
WordPress core has for several years provided a simple Resource Hints API which allows injecting tags into the HTML document that can be used to prefetch or prerender certain resources, among other actions. While prefetching can be useful for certain sub-resources of an HTML document, such as third-party script providers, prerendering goes as far as processing the resource and already performing some rendering offscreen and thus can be useful for entire web pages.
nnnn
However, using the approach of injecting link[rel="prefetch|prerender"]
tags is not very flexible, as the URLs to prefetch or prerender need to be defined as soon as the HTML is loaded. Providing a tag for every potential anchor link a user may click on the page would be wasteful, while not providing any misses a great opportunity for performance optimization. So far, solutions like Quicklink could be used to dynamically insert
tags to prefetch resources in the useru2019s viewport, which is more flexible, but still far from ideal as it may still excessively prefetch too many resources and requires a JavaScript library.
nnnn
More importantly though, link[rel="prerender"]
does not actually support prerendering, as the u201cprerenderu201d value is in fact used for something called NoState Prefetch, which means it is still only prefetching certain resources rather than prerendering them, which for instance would include running JavaScript. Last but not least, the u201cprerenderu201d value is deprecated at this point.
nnnn
Introducing the Speculation Rules API
nnnn
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 certain structure based on user interaction, in JSON syntaxu2014or in other words, speculatively preload those URLs before the navigation. This API can be used, for example, to prerender any links on a page whenever the user hovers over them. Also, with the Speculation Rules API, u201cprerenderu201d actually means to prerender the entire page, including running JavaScript. This can lead to near-instant load times once the user clicks on the link as the page would have most likely already been loaded in its entirety. However that is only one of the possible configurations.
nnnn
The following code example shows the general syntax of the Speculation Rules API JSON spec and outlines a configuration where any links other than WP Admin or login URLs are prerendered.
nnnn
nnnn
The Speculation Rules API allows defining URL patterns for which kind of URLs should be eligible for speculative loading. Rules can be configured to either prefetch or prerender certain URL patterns. A so-called u201ceagernessu201d value can also be specified which dictates how eagerly the prefetching or prerendering should be applied. For example, a value of u201cmoderateu201d triggers the speculative loading when the user hovers over the link. A value of u201cconservativeu201d delays this until the user clicks on the link (which still provides a decent performance benefit), while a value of u201ceageru201d acts as soon as there is the slightest suggestion a user may click the link. Note that caution is advised with the u201ceageru201d configuration in particular as it increases the likelihood of loading URLs wastefully.
nnnn
Browser support
nnnn
While the Speculation Rules API has been available in Chrome and Edge since version 109 in general, the particular subfeature needed to unlock the aforementioned functionality is called u201cdocument rulesu201d, which was only recently added in version 121. This post describes the latest enhancements to the API in more depth.
nnnn
In other words, at the time of writing this post end users will need to use either Chrome 121+ or Edge 121+ to get the benefits of this feature. However there are no adverse effects for users on other browsers, as this is a progressive enhancement. Therefore using the Speculation Rules API on your website is safe regardless of the user base.
nnnn
The Speculation Rules API was presented at the W3C web standards conference TPAC 2023, with positive reception. At this point, the standard is in draft stage. Positions regarding the API by Firefox and Safari have been requested. To keep track of specifically the required subfeatures for the functionality outlined in this post, you can refer to this u201cCan I useu201d table.
nnnn
The Speculative Loading WordPress plugin
nnnn
As mentioned in the beginning of this post, the WordPress Performance Team recently published a new feature plugin u201cSpeculative Loadingu201d which enables speculative loading of other frontend URLs linked on the page. It inserts a JSON script similar to the previous code example. By default, any URLs linked on the page are prerendered with an eagerness configuration of u201cmoderateu201d, which typically triggers when hovering over a link or focusing on it. As such, you donu2019t need to do anything after activating the plugin: it just works out of the box. The plugin also provides a few customization options to tweak the behavior to the site owneru2019s preference.
nnnn
The default behavior can be modified via a new u201cSpeculative Loadingu201d section in the Settings > Reading screen. For example, if the site is using JavaScript that is not yet adapted for being loaded while prerendering, the plugin could be configured to only prefetch documents. One could set the eagerness to u201cconservativeu201d to reduce the likelihood of URLs being loaded without the user navigating to them. Or one could set it to u201ceageru201d to increase the chance of the speculative loading already being completed by the time the user lands on the linked URL, which however runs at the risk of wastefully loading several resources. The default of u201cmoderateu201d strikes a good balance between sustainability and performance.
nnnn
The rules for which kinds of URLs to speculatively preload can be customized using a filter called u201cplsr_speculation_rules_href_exclude_pathsu201d. For example, plugins that add URLs to a WordPress site which modify user state just from being loaded could use that filter to exclude those URLs from being prerendered or prefetched.
nnnn
Here is a code example which would would ensure that URLs like https://example.com/cart/
or https://example.com/cart/foo/
would be excluded from prefetching and prerendering:
nnnn
nnnnPlease refer to the pluginu2019s FAQ for details on the filter.
nnnnPotential next steps
nnnnAt the moment, the plugin should be used to test the feature, and the Performance Team is eager to receive feedback as well as analyze the pluginu2019s performance benefits on load times.
nnnnDown the road, as the browser API and the plugin mature, the possibility of including the feature in WordPress core will be explored. However, in order to get there, additional feedback is needed.
nnnnTesting and feedback
nnnnYour testing and feedback is crucial to improve the feature ahead of exploring its potential usage in WordPress core. Please consider the following ways to help:
nnnn
- n
- Install and activate the Speculative Loading plugin on your site, via WP Admin or the Performance Lab plugin. That alone can go a long way. nnnn
- Try different configurations via the u201cSpeculative Loadingu201d section under Settings > Reading. nnnn
- Debug how the rules added by the plugin trigger speculative loading to understand the feature better and find potential bugs. Refer to u201dDebugging speculation rulesu201d. nnnn
- Report feedback (what works well, what does not) or bugs in the GitHub repository or in the pluginu2019s support forums. nnnn
- Integrate your plugins with the u201cplsr_speculation_rules_href_exclude_pathsu201d filter to exclude certain URLs from prefetching and/or prerendering, if you develop plugins that add interactive or dynamic content to a WordPress siteu2019s frontend. n
nnnn
The WordPress performance team is excited to learn more about how the Speculation Rules API is being used in WordPress sites. Please try the plugin and share your feedback!
nnnn
Props @adamsilverstein @domenicdenicola @jeremyroman @swissspidy @tunetheweb @tweetythierry @westonruter for review and proofreading.
nnn#feature-projects, #performance, #performance-lab, #speculative-loading","contentFiltered":"
The WordPress Performance Team recently published a new plugin called u201cSpeculative Loadingu201d which enables a new technology of the same name to automatically prerender certain URLs on the page, which can lead to near-instant page load times. The functionality is powered by the Speculation Rules API, a new web API that allows defining rules for which kinds of URLs to prefetch or prerender.
nnnn
Please install and test the plugin to provide feedback to inform further improvements before a potential consideration to include such a feature in WordPress core. You can install the plugin by searching u201cspeculative loadingu201d in WP Admin, or via the Performance Lab plugin.
nnnn
A brief history of prefetch and prerender in WordPress
nnnn
WordPress core has for several years provided a simple Resource Hints API which allows injecting tags into the HTML document that can be used to prefetch or prerender certain resources, among other actions. While prefetching can be useful for certain sub-resources of an HTML document, such as third-party script providers, prerendering goes as far as processing the resource and already performing some rendering offscreen and thus can be useful for entire web pages.
nnnn
However, using the approach of injecting link[rel="prefetch|prerender"]
tags is not very flexible, as the URLs to prefetch or prerender need to be defined as soon as the HTML is loaded. Providing a tag for every potential anchor link a user may click on the page would be wasteful, while not providing any misses a great opportunity for performance optimization. So far, solutions like Quicklink could be used to dynamically insert
tags to prefetch resources in the useru2019s viewport, which is more flexible, but still far from ideal as it may still excessively prefetch too many resources and requires a JavaScript library.
nnnn
More importantly though, link[rel="prerender"]
does not actually support prerendering, as the u201cprerenderu201d value is in fact used for something called NoState Prefetch, which means it is still only prefetching certain resources rather than prerendering them, which for instance would include running JavaScript. Last but not least, the u201cprerenderu201d value is deprecated at this point.
nnnn
Introducing the Speculation Rules API
nnnn
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 certain structure based on user interaction, in JSON syntaxu2014or in other words, speculatively preload those URLs before the navigation. This API can be used, for example, to prerender any links on a page whenever the user hovers over them. Also, with the Speculation Rules API, u201cprerenderu201d actually means to prerender the entire page, including running JavaScript. This can lead to near-instant load times once the user clicks on the link as the page would have most likely already been loaded in its entirety. However that is only one of the possible configurations.
nnnn
The following code example shows the general syntax of the Speculation Rules API JSON spec and outlines a configuration where any links other than WP Admin or login URLs are prerendered.
nnn
nn
nnn
The Speculation Rules API allows defining URL patterns for which kind of URLs should be eligible for speculative loading. Rules can be configured to either prefetch or prerender certain URL patterns. A so-called u201ceagernessu201d value can also be specified which dictates how eagerly the prefetching or prerendering should be applied. For example, a value of u201cmoderateu201d triggers the speculative loading when the user hovers over the link. A value of u201cconservativeu201d delays this until the user clicks on the link (which still provides a decent performance benefit), while a value of u201ceageru201d acts as soon as there is the slightest suggestion a user may click the link. Note that caution is advised with the u201ceageru201d configuration in particular as it increases the likelihood of loading URLs wastefully.
nnnn
Browser support
nnnn
While the Speculation Rules API has been available in Chrome and Edge since version 109 in general, the particular subfeature needed to unlock the aforementioned functionality is called u201cdocument rulesu201d, which was only recently added in version 121. This post describes the latest enhancements to the API in more depth.
nnnn
In other words, at the time of writing this post end users will need to use either Chrome 121+ or Edge 121+ to get the benefits of this feature. However there are no adverse effects for users on other browsers, as this is a progressive enhancement. Therefore using the Speculation Rules API on your website is safe regardless of the user base.
nnnn
The Speculation Rules API was presented at the W3C web standards conference TPAC 2023, with positive reception. At this point, the standard is in draft stage. Positions regarding the API by Firefox and Safari have been requested. To keep track of specifically the required subfeatures for the functionality outlined in this post, you can refer to this u201cCan I useu201d table.
nnnn
The Speculative Loading WordPress plugin
nnnn
As mentioned in the beginning of this post, the WordPress Performance Team recently published a new feature plugin u201cSpeculative Loadingu201d which enables speculative loading of other frontend URLs linked on the page. It inserts a JSON script similar to the previous code example. By default, any URLs linked on the page are prerendered with an eagerness configuration of u201cmoderateu201d, which typically triggers when hovering over a link or focusing on it. As such, you donu2019t need to do anything after activating the plugin: it just works out of the box. The plugin also provides a few customization options to tweak the behavior to the site owneru2019s preference.
nnnn
The default behavior can be modified via a new u201cSpeculative Loadingu201d section in the Settings > Reading screen. For example, if the site is using JavaScript that is not yet adapted for being loaded while prerendering, the plugin could be configured to only prefetch documents. One could set the eagerness to u201cconservativeu201d to reduce the likelihood of URLs being loaded without the user navigating to them. Or one could set it to u201ceageru201d to increase the chance of the speculative loading already being completed by the time the user lands on the linked URL, which however runs at the risk of wastefully loading several resources. The default of u201cmoderateu201d strikes a good balance between sustainability and performance.
nnnn
The rules for which kinds of URLs to speculatively preload can be customized using a filter called u201cplsr_speculation_rules_href_exclude_pathsu201d. For example, plugins that add URLs to a WordPress site which modify user state just from being loaded could use that filter to exclude those URLs from being prerendered or prefetched.u00a0
nnnn
Here is a code example which would would ensure that URLs like https://example.com/cart/
or https://example.com/cart/foo/
would be excluded from prefetching and prerendering:
nnn
n
nnn
Please refer to the pluginu2019s FAQ for details on the filter.
nnnn
Potential next steps
nnnn
At the moment, the plugin should be used to test the feature, and the Performance Team is eager to receive feedback as well as analyze the pluginu2019s performance benefits on load times.
nnnn
Down the road, as the browser API and the plugin mature, the possibility of including the feature in WordPress core will be explored. However, in order to get there, additional feedback is needed.
nnnn
Testing and feedback
nnnn
Your testing and feedback is crucial to improve the feature ahead of exploring its potential usage in WordPress core. Please consider the following ways to help:
nnnn
- n
- Install and activate the Speculative Loading plugin on your site, via WP Admin or the Performance Lab plugin. That alone can go a long way. nnnn
- Try different configurations via the u201cSpeculative Loadingu201d section under Settings > Reading. nnnn
- Debug how the rules added by the plugin trigger speculative loading to understand the feature better and find potential bugs. Refer to u201dDebugging speculation rulesu201d. nnnn
- Report feedback (what works well, what does not) or bugs in the GitHub repository or in the pluginu2019s support forums. nnnn
- Integrate your plugins with the u201cplsr_speculation_rules_href_exclude_pathsu201d filter to exclude certain URLs from prefetching and/or prerendering, if you develop plugins that add interactive or dynamic content to a WordPress siteu2019s frontend. n
nnnn
The WordPress performance team is excited to learn more about how the Speculation Rules API is being used in WordPress sites. Please try the plugin and share your feedback!
nnnn
Props @adamsilverstein @domenicdenicola @jeremyroman @swissspidy @tunetheweb @tweetythierry @westonruter for review and proofreading.
n
","permalink":"https://make.wordpress.org/core/2024/04/09/speculative-loading-in-wordpress/","unixtime":1712681690,"unixtimeModified":1712681690,"entryHeaderMeta":"","linkPages":"","footerEntryMeta":"","tagsRaw":"feature projects, performance, performance-lab, speculative loading","tagsArray":[{"label":"feature projects","count":49,"link":"https://make.wordpress.org/core/tag/feature-projects/"},{"label":"performance","count":304,"link":"https://make.wordpress.org/core/tag/performance/"},{"label":"performance-lab","count":6,"link":"https://make.wordpress.org/core/tag/performance-lab/"},{"label":"speculative loading","count":1,"link":"https://make.wordpress.org/core/tag/speculative-loading/"}],"loginRedirectURL":"https://login.wordpress.org/?redirect_to=https%3A%2F%2Fmake.wordpress.org%2Fcore%2F2024%2F04%2F09%2Fspeculative-loading-in-wordpress%2F&locale=en_US","hasPrevPost":false,"prevPostTitle":"","prevPostURL":"","hasNextPost":false,"nextPostTitle":"","nextPostURL":"","commentsOpen":true,"is_xpost":false,"editURL":null,"postActions":"","comments":[{"type":"comment","id":"46520","postID":"112421","postTitleRaw":"Speculative Loading in WordPress","cssClasses":"comment byuser comment-author-samiamnot even thread-even depth-1","parentID":"0","contentRaw":"Nice stuff. Is there a way to configure the plugin to pre-render links to my own site, but not bother for 3rd party links? There is likely a client sided bandwidth and CPU costs for pre-rendering, and I would like to limit it to only help navigation within my site be faster. Detailed steps would be appreciated.","contentFiltered":"
Nice stuff. Is there a way to configure the plugin to pre-render links to my own site, but not bother for 3rd party links? There is likely a client sided bandwidth and CPU costs for pre-rendering, and I would like to limit it to only help navigation within my site be faster. Detailed steps would be appreciated.
n","permalink":"https://make.wordpress.org/core/2024/04/09/speculative-loading-in-wordpress/#comment-46520","unixtime":1712701630,"loginRedirectURL":"https://login.wordpress.org/?redirect_to=https%3A%2F%2Fmake.wordpress.org%2Fcore%2F2024%2F04%2F09%2Fspeculative-loading-in-wordpress%2F%23comment-46520&locale=en_US","approved":true,"isTrashed":false,"prevDeleted":"","editURL":null,"depth":1,"commentDropdownActions":"","commentFooterActions":"
","commentTrashedActions":"","mentions":[],"mentionContext":"","commentCreated":"1712701630","hasChildren":false,"userLogin":"samiamnot","userNicename":"samiamnot"},{"type":"comment","id":"46521","postID":"112421","postTitleRaw":"Speculative Loading in WordPress","cssClasses":"comment byuser comment-author-flixos90 bypostauthor odd alt depth-2","parentID":"46520","contentRaw":"Based on the current implementation in the plugin, it should already only prerender or prefetch URLs that belong to the same site. Please let me know if you encounter different behavior with the plugin.","contentFiltered":"
Based on the current implementation in the plugin, it should already only prerender or prefetch URLs that belong to the same site. Please let me know if you encounter different behavior with the plugin.
n","permalink":"https://make.wordpress.org/core/2024/04/09/speculative-loading-in-wordpress/#comment-46521","unixtime":1712703459,"loginRedirectURL":"https://login.wordpress.org/?redirect_to=https%3A%2F%2Fmake.wordpress.org%2Fcore%2F2024%2F04%2F09%2Fspeculative-loading-in-wordpress%2F%23comment-46521&locale=en_US","approved":true,"isTrashed":false,"prevDeleted":"","editURL":null,"depth":2,"commentDropdownActions":"","commentFooterActions":"
","commentTrashedActions":"","mentions":[],"mentionContext":"","commentCreated":"1712703459","hasChildren":false,"userLogin":"flixos90","userNicename":"flixos90"},{"type":"comment","id":"46522","postID":"112421","postTitleRaw":"Speculative Loading in WordPress","cssClasses":"comment byuser comment-author-mrwweb even thread-odd thread-alt depth-1","parentID":"0","contentRaw":"Having now read both this and much of the MDN page on the Speculative Loading API, I'm initially quite skeptical of implementing this for all WordPress sites with the "moderate" level of eagerness.nnIt sounds to me like the description that "moderate" === "when hovering or focusing" is probably a presumption of how user agents will implement the eagerness value and not the guaranteed literal behavior, but I would be concerned about that behavior, if true, given that a person navigating with a keyboard would trigger prerendering of every link they pass on the page.nnFurther, the MDN page includes a number of warnings about the wasteful use of data and energy made possibly by this feature, and so I'm really wondering about defaulting to anything beyond "conservative" eagerness.nnHere are two quotes from MDN:nn
"As a result, you are encouraged to adopt prerendering more sparingly, carefully considering cases where there is a high likelihood of the page being navigated to, and you think the user experience benefit is worth the extra cost."
nn
Prerendering is more risky to adopt than prefetching and should therefore be done sparingly, in cases where it is worth it. There are more unsafe conditions to watch out for with prerendering so, while the reward is higher, the risk is too.
nnThat just doesn't really sound like a feature that should be defaulted on for WordPress to me at first look. But I'm definitely open to learning more and being convinced otherwise.nnFinally, it needs to be very clear up front that this feature will have a much more significant negative impact on people with low-powered devices, old batteries, slow connections, and pay-as-you-go data plans. Therefore, I think it's especially important that parts of the WordPress community more likely to experience these conditions get to weigh in on whether the benefits outweigh the downsides.","contentFiltered":"
Having now read both this and much of the MDN page on the Speculative Loading API, Iu2019m initially quite skeptical of implementing this for all WordPress sites with the u201cmoderateu201d level of eagerness.
n
It sounds to me like the description that u201cmoderateu201d === u201cwhen hovering or focusingu201d is probably a presumption of how user agents will implement the eagerness value and not the guaranteed literal behavior, but I would be concerned about that behavior, if true, given that a person navigating with a keyboard would trigger prerendering of every link they pass on the page.
n
Further, the MDN page includes a number of warnings about the wasteful use of data and energy made possibly by this feature, and so Iu2019m really wondering about defaulting to anything beyond u201cconservativeu201d eagerness.
n
Here are two quotes from MDN:
n
u201cAs a result, you are encouraged to adopt prerendering more sparingly, carefully considering cases where there is a high likelihood of the page being navigated to, and you think the user experience benefit is worth the extra cost.u201d
n
Prerendering is more risky to adopt than prefetching and should therefore be done sparingly, in cases where it is worth it. There are more unsafe conditions to watch out for with prerendering so, while the reward is higher, the risk is too.
n
That just doesnu2019t really sound like a feature that should be defaulted on for WordPress to me at first look. But Iu2019m definitely open to learning more and being convinced otherwise.
n
Finally, it needs to be very clear up front that this feature will have a much more significant negative impact on people with low-powered devices, old batteries, slow connections, and pay-as-you-go data plans. Therefore, I think itu2019s especially important that parts of the WordPress community more likely to experience these conditions get to weigh in on whether the benefits outweigh the downsides.
n","permalink":"https://make.wordpress.org/core/2024/04/09/speculative-loading-in-wordpress/#comment-46522","unixtime":1712703699,"loginRedirectURL":"https://login.wordpress.org/?redirect_to=https%3A%2F%2Fmake.wordpress.org%2Fcore%2F2024%2F04%2F09%2Fspeculative-loading-in-wordpress%2F%23comment-46522&locale=en_US","approved":true,"isTrashed":false,"prevDeleted":"","editURL":null,"depth":1,"commentDropdownActions":"","commentFooterActions":"
","commentTrashedActions":"","mentions":[],"mentionContext":"","commentCreated":"1712703699","hasChildren":false,"userLogin":"mrwweb","userNicename":"mrwweb"},{"type":"comment","id":"46527","postID":"112421","postTitleRaw":"Speculative Loading in WordPress","cssClasses":"comment byuser comment-author-gziolo odd alt thread-even depth-1","parentID":"0","contentRaw":"This is interesting. On the Interactivity API front, we are close to landing an experiment in the Gutenberg plugin that offers a full page client-side navigation. Behind the scenes, the interactivity router is using some sort of `prefetch` strategy at the moment to speed up the transition between pages. I'm not an expert in this area, but I would be interested in discussing how much overlap there is between both initiatives and what would be the best way to shape the direction so everything integrates seamlessly.","contentFiltered":"
This is interesting. On the Interactivity API front, we are close to landing an experiment in the Gutenberg plugin that offers a full page client-side navigation. Behind the scenes, the interactivity router is using some sort of `prefetch` strategy at the moment to speed up the transition between pages. Iu2019m not an expert in this area, but I would be interested in discussing how much overlap there is between both initiatives and what would be the best way to shape the direction so everything integrates seamlessly.
n","permalink":"https://make.wordpress.org/core/2024/04/09/speculative-loading-in-wordpress/#comment-46527","unixtime":1712738411,"loginRedirectURL":"https://login.wordpress.org/?redirect_to=https%3A%2F%2Fmake.wordpress.org%2Fcore%2F2024%2F04%2F09%2Fspeculative-loading-in-wordpress%2F%23comment-46527&locale=en_US","approved":true,"isTrashed":false,"prevDeleted":"","editURL":null,"depth":1,"commentDropdownActions":"","commentFooterActions":"
","commentTrashedActions":"","mentions":[],"mentionContext":"","commentCreated":"1712738411","hasChildren":false,"userLogin":"gziolo","userNicename":"gziolo"},{"type":"comment","id":"46532","postID":"112421","postTitleRaw":"Speculative Loading in WordPress","cssClasses":"comment byuser comment-author-mte90 even depth-2","parentID":"46522","contentRaw":"Also to this consideration, the very issue is on mobile. In that scenario, there is the slowness, but the hover doesn't exist on mobile.","contentFiltered":"
Also to this consideration, the very issue is on mobile. In that scenario, there is the slowness, but the hover doesnu2019t exist on mobile.
n","permalink":"https://make.wordpress.org/core/2024/04/09/speculative-loading-in-wordpress/#comment-46532","unixtime":1712752715,"loginRedirectURL":"https://login.wordpress.org/?redirect_to=https%3A%2F%2Fmake.wordpress.org%2Fcore%2F2024%2F04%2F09%2Fspeculative-loading-in-wordpress%2F%23comment-46532&locale=en_US","approved":true,"isTrashed":false,"prevDeleted":"","editURL":null,"depth":2,"commentDropdownActions":"","commentFooterActions":"
","commentTrashedActions":"","mentions":[],"mentionContext":"","commentCreated":"1712752715","hasChildren":false,"userLogin":"Mte90","userNicename":"mte90"},{"type":"comment","id":"46535","postID":"112421","postTitleRaw":"Speculative Loading in WordPress","cssClasses":"comment byuser comment-author-flixos90 bypostauthor odd alt depth-2","parentID":"46522","contentRaw":"This is definitely something we are considering, and exactly what we need to get feedback for from end users. FWIW the plugin implementation is not necessarily what would end up in core. In fact, we went with the "moderate" default because we would like to get a better idea how risky it is, and since the plugin is for early testing of the feature.nnSo we have to assess this based on field analysis and user feedback. Additionally though, and to your point about low-powered devices, the browser implementation of the Speculation Rules API heuristics is still being evaluated. It's not a one-size-fits-all approach, so based on the available resources the behavior may differ slightly, similar to e.g. memory saver mode in Chrome.","contentFiltered":"
This is definitely something we are considering, and exactly what we need to get feedback for from end users. FWIW the plugin implementation is not necessarily what would end up in core. In fact, we went with the u201cmoderateu201d default because we would like to get a better idea how risky it is, and since the plugin is for early testing of the feature.
n
So we have to assess this based on field analysis and user feedback. Additionally though, and to your point about low-powered devices, the browser implementation of the Speculation Rules API heuristics is still being evaluated. Itu2019s not a one-size-fits-all approach, so based on the available resources the behavior may differ slightly, similar to e.g. memory saver mode in Chrome.
n","permalink":"https://make.wordpress.org/core/2024/04/09/speculative-loading-in-wordpress/#comment-46535","unixtime":1712762354,"loginRedirectURL":"https://login.wordpress.org/?redirect_to=https%3A%2F%2Fmake.wordpress.org%2Fcore%2F2024%2F04%2F09%2Fspeculative-loading-in-wordpress%2F%23comment-46535&locale=en_US","approved":true,"isTrashed":false,"prevDeleted":"","editURL":null,"depth":2,"commentDropdownActions":"","commentFooterActions":"
","commentTrashedActions":"","mentions":[],"mentionContext":"","commentCreated":"1712762354","hasChildren":false,"userLogin":"flixos90","userNicename":"flixos90"},{"type":"comment","id":"46536","postID":"112421","postTitleRaw":"Speculative Loading in WordPress","cssClasses":"comment byuser comment-author-flixos90 bypostauthor even depth-3","parentID":"46532","contentRaw":"Sorry, this is mostly poor phrasing from my end. I didn't want to make the sentence to verbose, but on mobile hover is of course replaced with a mobile-appropriate action, like touchstart for example.","contentFiltered":"
Sorry, this is mostly poor phrasing from my end. I didnu2019t want to make the sentence to verbose, but on mobile hover is of course replaced with a mobile-appropriate action, like touchstart for example.
n","permalink":"https://make.wordpress.org/core/2024/04/09/speculative-loading-in-wordpress/#comment-46536","unixtime":1712762409,"loginRedirectURL":"https://login.wordpress.org/?redirect_to=https%3A%2F%2Fmake.wordpress.org%2Fcore%2F2024%2F04%2F09%2Fspeculative-loading-in-wordpress%2F%23comment-46536&locale=en_US","approved":true,"isTrashed":false,"prevDeleted":"","editURL":null,"depth":3,"commentDropdownActions":"","commentFooterActions":"
","commentTrashedActions":"","mentions":[],"mentionContext":"","commentCreated":"1712762409","hasChildren":false,"userLogin":"flixos90","userNicename":"flixos90"},{"type":"comment","id":"46537","postID":"112421","postTitleRaw":"Speculative Loading in WordPress","cssClasses":"comment byuser comment-author-flixos90 bypostauthor odd alt depth-2","parentID":"46527","contentRaw":"Thanks, this is a great topic to think about. I commented on the PR for now.","contentFiltered":"
Thanks, this is a great topic to think about. I commented on the PR for now.
n","permalink":"https://make.wordpress.org/core/2024/04/09/speculative-loading-in-wordpress/#comment-46537","unixtime":1712763324,"loginRedirectURL":"https://login.wordpress.org/?redirect_to=https%3A%2F%2Fmake.wordpress.org%2Fcore%2F2024%2F04%2F09%2Fspeculative-loading-in-wordpress%2F%23comment-46537&locale=en_US","approved":true,"isTrashed":false,"prevDeleted":"","editURL":null,"depth":2,"commentDropdownActions":"","commentFooterActions":"
","commentTrashedActions":"","mentions":[],"mentionContext":"","commentCreated":"1712763324","hasChildren":false,"userLogin":"flixos90","userNicename":"flixos90"},{"type":"comment","id":"46538","postID":"112421","postTitleRaw":"Speculative Loading in WordPress","cssClasses":"comment byuser comment-author-mrwweb even depth-3","parentID":"46535","contentRaw":"Thanks for clarifying that, @flixos90. It's helpful to understand that this is more about understanding the implications rather than a formal proposal.nnI did see that the browser heuristics will take into account data-saver and battery-saver which is good!nnI think my biggest point is that 1) this feature isn't without downsides and risks AND 2) the people who seem most likely to be negatively impacted by this feature are probably not be well represented in the normal groups of WP core contributors. So I'd just urge a lot of caution and explicit outreach to different communities during the assessment period.","contentFiltered":"
Thanks for clarifying that, @flixos90. Itu2019s helpful to understand that this is more about understanding the implications rather than a formal proposal.
n
I did see that the browser heuristics will take into account data-saver and battery-saver which is good!
n
I think my biggest point is that 1) this feature isnu2019t without downsides and risks AND 2) the people who seem most likely to be negatively impacted by this feature are probably not be well represented in the normal groups of WP core contributors. So Iu2019d just urge a lot of caution and explicit outreach to different communities during the assessment period.
n","permalink":"https://make.wordpress.org/core/2024/04/09/speculative-loading-in-wordpress/#comment-46538","unixtime":1712769457,"loginRedirectURL":"https://login.wordpress.org/?redirect_to=https%3A%2F%2Fmake.wordpress.org%2Fcore%2F2024%2F04%2F09%2Fspeculative-loading-in-wordpress%2F%23comment-46538&locale=en_US","approved":true,"isTrashed":false,"prevDeleted":"","editURL":null,"depth":3,"commentDropdownActions":"","commentFooterActions":"
","commentTrashedActions":"","mentions":["flixos90"],"mentionContext":"","commentCreated":"1712769457","hasChildren":false,"userLogin":"mrwweb","userNicename":"mrwweb"},{"type":"comment","id":"46539","postID":"112421","postTitleRaw":"Speculative Loading in WordPress","cssClasses":"comment byuser comment-author-mnelson4 odd alt thread-odd thread-alt depth-1","parentID":"0","contentRaw":"Sounds nice! If a site is using some tote of visitor analytics, it sounds like p pop refetching entire web pages could be misinterpreted by the analytics as a site visit, right? How does the siteu2019s PHP/JS distinguish between a regular visit and a prefetch? And would there be some tour of other mini-request when the user finally does *actually* visit the page?","contentFiltered":"
Sounds nice! If a site is using some tote of visitor analytics, it sounds like p pop refetching entire web pages could be misinterpreted by the analytics as a site visit, right? How does the siteu2019s PHP/JS distinguish between a regular visit and a prefetch? And would there be some tour of other mini-request when the user finally does *actually* visit the page?
n","permalink":"https://make.wordpress.org/core/2024/04/09/speculative-loading-in-wordpress/#comment-46539","unixtime":1712780078,"loginRedirectURL":"https://login.wordpress.org/?redirect_to=https%3A%2F%2Fmake.wordpress.org%2Fcore%2F2024%2F04%2F09%2Fspeculative-loading-in-wordpress%2F%23comment-46539&locale=en_US","approved":true,"isTrashed":false,"prevDeleted":"","editURL":null,"depth":1,"commentDropdownActions":"","commentFooterActions":"
","commentTrashedActions":"","mentions":[],"mentionContext":"","commentCreated":"1712780078","hasChildren":false,"userLogin":"mnelson4","userNicename":"mnelson4"},{"type":"comment","id":"46540","postID":"112421","postTitleRaw":"Speculative Loading in WordPress","cssClasses":"comment byuser comment-author-westonruter even depth-2","parentID":"46539","contentRaw":"@mnelson4 You're right. It's up to the analytics provider to not track a visit that is prerendered. There is a JS API to detect when in the prerendered state and when a prerendered page has been loaded. See this Impact on analytics section of on the Chrome for Developers post.","contentFiltered":"
@mnelson4 Youu2019re right. Itu2019s up to the analytics provider to not track a visit that is prerendered. There is a JS API to detect when in the prerendered state and when a prerendered page has been loaded. See this Impact on analytics section of on the Chrome for Developers post.
n","permalink":"https://make.wordpress.org/core/2024/04/09/speculative-loading-in-wordpress/#comment-46540","unixtime":1712795140,"loginRedirectURL":"https://login.wordpress.org/?redirect_to=https%3A%2F%2Fmake.wordpress.org%2Fcore%2F2024%2F04%2F09%2Fspeculative-loading-in-wordpress%2F%23comment-46540&locale=en_US","approved":true,"isTrashed":false,"prevDeleted":"","editURL":null,"depth":2,"commentDropdownActions":"","commentFooterActions":"
","commentTrashedActions":"","mentions":["mnelson4"],"mentionContext":"","commentCreated":"1712795140","hasChildren":false,"userLogin":"westonruter","userNicename":"westonruter"},{"type":"comment","id":"46541","postID":"112421","postTitleRaw":"Speculative Loading in WordPress","cssClasses":"comment byuser comment-author-mnelson4 odd alt depth-3","parentID":"46540","contentRaw":"Thanks for the links. I bet analytics plugin devs would appreciate being specifically notified of this change that could kinda break their analytics data. Iu2019m going to notify the dev of my analytics pluginu2026","contentFiltered":"
Thanks for the links. I bet analytics plugin devs would appreciate being specifically notified of this change that could kinda break their analytics data. Iu2019m going to notify the dev of my analytics pluginu2026
n","permalink":"https://make.wordpress.org/core/2024/04/09/speculative-loading-in-wordpress/#comment-46541","unixtime":1712813992,"loginRedirectURL":"https://login.wordpress.org/?redirect_to=https%3A%2F%2Fmake.wordpress.org%2Fcore%2F2024%2F04%2F09%2Fspeculative-loading-in-wordpress%2F%23comment-46541&locale=en_US","approved":true,"isTrashed":false,"prevDeleted":"","editURL":null,"depth":3,"commentDropdownActions":"","commentFooterActions":"
","commentTrashedActions":"","mentions":[],"mentionContext":"","commentCreated":"1712813992","hasChildren":false,"userLogin":"mnelson4","userNicename":"mnelson4"}],"postFormat":"standard","postMeta":{"isSticky":false},"postTerms":{"category":[{"label":"Feature Plugins","count":121,"link":"https://make.wordpress.org/core/category/feature-plugins/"},{"label":"Proposals","count":87,"link":"https://make.wordpress.org/core/category/proposals/"}],"post_tag":[{"label":"feature projects","count":49,"link":"https://make.wordpress.org/core/tag/feature-projects/"},{"label":"performance","count":304,"link":"https://make.wordpress.org/core/tag/performance/"},{"label":"performance-lab","count":6,"link":"https://make.wordpress.org/core/tag/performance-lab/"},{"label":"speculative loading","count":1,"link":"https://make.wordpress.org/core/tag/speculative-loading/"}],"post_format":[]},"pluginData":[],"isPage":false,"mentions":["adamsilverstein","domenicdenicola","jeremyroman","swissspidy","tunetheweb","tweetythierry","westonruter"],"mentionContext":"","isTrashed":false,"userLogin":"flixos90","userNicename":"flixos90"}]