WordPress 6.8 引入了“推测加载”功能。 简单来说这是一种通过推测访客接下来可能会查看的页面并预先加载它们来使用户的网站感觉更快的技术。推测加载是一种技术,浏览器在用户实际请求之前加载资源(如图像、脚本、字体,甚至是整个页面)。这些操作基于对用户接下来最有可能访问的页面的推测,或者基于代码中的提示。这可能包括 DNS 查找、资源获取,甚至在后台渲染文档。

WordPress 推测加载 WordPress Speculative Loading

截至子凡本文发布,Speculation Rules API 已在基于 Chromium 的浏览器中支持,但尚不支持 Firefox 或 Safari。所以用户需要使用最新版本的 Chrome、Edge 或 Opera 才能利用该功能。对于不支持的浏览器,该代码仍然可以在您的网站上找到,但是由于 Speculation Rules API 是一个渐进增强,不会引起任何错误,浏览器会将其简单忽略。

如何检查“推测加载”是否生效

为了验证推测加载是否生效,可以使用浏览器的开发者工具检查网站。

chrome prefetch

WordPress 6.8 版本后就已经实现了推测加载,可以在网页底部 js 看到 script type=”speculationrules”部分就是规则。

1
2
3
<script type="speculationrules">
{"prefetch":[{"source":"document","where":{"and":[{"href_matches":"/*"},{"not":{"href_matches":["/wp-*.php","/wp-admin/*","/uploads/*","/wp-content/*","/wp-content/plugins/*","/wp-content/themes/Fanly/*","/*?(.+)"]}},{"not":{"selector_matches":"a[rel~="nofollow"]"}},{"not":{"selector_matches":".no-prefetch, .no-prefetch a"}}]},"eagerness":"conservative"}]}
</script>

通过 Chrome 浏览器的最新版本的开发者工具的“应用-推测加载”中查看规则和推测匹配的当前 url 链接,当点击链接后就会触发推测加载,状态才会从未触发变为成功,如果只是鼠标划过和悬停并不会触发。

推测加载功能是否有必要?

WordPress 6.8 版本默认在所有网站上启用推测加载,所以只要你升级到最新版本的 WordPress 后就能够在网页源码中查看到推测加载的相关代码规则,这本来也是一个非常美好和提升用户体验的功能,但是也并非没有缺点,下面子凡简单的给大家分享一下为什么可能需要禁用 WordPress 推测加载功能的原因。

1.不必要的服务器使用:在高流量网站上可能会增加资源使用,影响性能和带宽成本。由于推测加载依赖于推测,可能会导致用户实际上从未访问过的页面和资源的请求。

2.提供过时内容的可能性:网站更新频繁的话,推测加载可能会提供过时的内容。例如实时新闻网站在预取更新信息的文章时可能会看到旧版本,而不是更新后的最新版本。

3.浏览器兼容性较低:推测加载功能目前在 Safari 和 Firefox 并未支持,虽然不足以成为禁用的原因,但如果大多数用户使用这些浏览器,他们将无法受益于推测加载,反而增加页面代码冗余。

WordPress 禁用推测加载

如果你已经确定推测加载功能不适合你当前的 WordPress 网站,那么可以通过将以下子凡提供的代码添加到你的插件或当前主题的 functions.php 文件中来禁用推测加载功能。

1
2
// WordPress 禁用推测加载
add_filter( 'wp_speculation_rules_configuration', '__return_null' );

简单总结

WordPress 推测加载旨在通过在用户点击页面之前预先加载页面来提高感知性能。在许多情况下这是一种有价值的增强。然而也确实存在权衡,特别是对于高流量网站、实时内容或插件兼容性问题的网站。

但是 WordPress 没有提供关闭的选项,即使是在有益的情况下,也并不简单一定适合所有网址的应用场景,就像容易增加服务器负担的情况下就让子凡我不是特别能接受,所以可能在很多的情况下子凡我可能会更愿意选择禁用这个推测加载功能。

更多关于WordPress优化及疑问可以添加QQ群:255308000

除非注明,否则均为泪雪博客原创文章,禁止任何形式转载

本文链接:https://zhangzifan.com/wordpress-speculationrules.html