重要提示:选择动态设置时,请务必参考支持文档,了解将来可能出现的未来发展和用例。
要告知浏览器需要预渲染哪些 URL ,您可以在页面上插入 JSON 指令
类似地,插入以下 JSON 指令以进行预取:
可以向一个页面添加多个推测规则,在这种情况下,:
-
URL 列表
-
-
一组推测规则内的多个列表
指定预渲染/预取的路由
微调推测加载涉及指定预渲染 医师数据库 和预取的路由。通过根据页面的重要性或用户导航的可能性对页面进行分类,开发人员可以优化推测加载策略。
但是,有些路线被认为是不安全的,例如:
-
退出 URL;
-
语言切换 URL;
-
“添加到购物车” URL;
-
服务器要求发送短信的登录流程 URL,例如当需要双因素身份验证 (2FA) 时;
-
启动服务器端广告转化跟踪的 URL;
-
触发用户使用限制的 URL,例如,通过使用其每月免费文章限额。
与从缓存中排除此类页面类似,避免 Torla-Ordesa:比利牛斯山脚下美丽的山城 预取和预渲染它们的原因与动态变量有关。
这些是内容敏感的页面,其中的值根据用户操作进行更新,并且通过在后台预加载它们,显示页面过时状态的风险非常高。
准确性和权衡
正如 Barry Pollard 在我们的“即时加载页面”网络研讨会中提到的那样:
“[使用预取和预渲染] 是关于平衡,试图找出 AU 手机号码 如何减少浪费效率(正确预测的百分比)并提高预测准确性(使用的预测数量)。”
虽然预取是您可以在多个网页上复制的最安全的方法,但它提供的回报也最低,因为它只涉及下载特定的资源。
另一方面,全页面预渲染提供了更高的回报,但应谨慎使用,因为它们可能会:
-
使浏览器不堪重负,因为它只能在后台运行有限数量的任务。
-
消耗大量带宽和 CPU 资源,这会导致网络较慢或资源有限的设备上的用户性能下降。
-
如果访问者不导航到该页面,会导致更高的资源浪费。
要正确设置预渲染,您应该考虑用户的行为并分析整个网站的常见导航。使用热图和 Google Analytics 流程图,您可以确定基本路线并开始预测加载实验。
要检查页面是否已预渲染,请使用然后可以使用自定义维度进行记录:
这样,您将能够衡量预渲染与其他类型导航之间的比率。
此外,还需要统计后续未被访问的预渲染页面的数量,以优化推测规则,实现更高的命中率,减少资源浪费。
您可以通过在插入推测规则时触发分析事件来指示已请求预渲染。然后将这些事件的数量与实际的预渲染页面浏览量进行比较。
或者你可以…
考虑使用 Navigation AI 实现自动页面预渲染
Navigation AI是一款由人工智能驱动的网页浏览优化器,可主动预测和分析用户行为,以在客户旅程中预渲染完整的页面。
导航 AI 使网站所有者无需编写任何代码即可在桌面和移动设备上提供即时浏览体验,从而提高客户参与度和转化率。
注意: Navigation AI 与 NitroPack 100% 兼容,并进一步为网站所有者带来好处。
Navigation AI 建立在Speculation Rules API之上,并提供了一种自动化解决方案,以在预渲染场景中实现高命中率和资源效率。
通过根据数据对页面加载应用 AI 增强的初始预测并分析用户行为,Navigation AI 可以调整预测并准确指示 Speculation Rules API 预渲染实际访问的页面。
由于该页面已在背景中绘制,因此页面可即时加载。在移动设备上,Navigation AI 依靠识别用户在页面上的位置,鉴于视口较小,它可以轻松预测用户将点击的位置。
基于1200个网站,Navigation AI 已经展现出惊人的效果。
-
结果 1:使用导航 AI 的网页始终显示加载时间约为 2.86 秒,而未使用导航 AI 的网页则显示加载时间约为 6.12 秒
-
结果 2:使用 Navigation AI,预渲染页面的 LCP 提高了 85%(从 3.1 秒到 0.4 秒),CLS 提高了 80%(从 0.3 秒到 0.06 秒)。对于预取页面,Navigation AI 将 LCP 提高了 52%(从 3.1 秒到 1.5 秒)。
-
结果 3:借助 Navigation AI,整个网站的性能指标显著提高:LCP 提高 15%、CLS 提高 8%、TTFB 提高 26%
推测规则 API 和 WordPress
在我们的“即时页面加载”网络研讨会上,谷歌的开发者关系工程师 Adam Silverstein 透露,WordPress 核心性能团队正在致力于更稳定地实现新的推测规则 API。
目前,重点仍然是向生态系统中的网站所有者和开发人员提供一小部分 API 功能,以测试其效率和采用率,然后再将其纳入核心。以下是 WordPress 用户目前可以利用的功能:
-
Performance Lab 插件中的一个模块