文档:prerendering 属性

实验性: 这是一个 实验性技术
在生产环境中使用之前,请仔细查看 浏览器兼容性表格

prerenderingDocument 接口的一个只读属性,如果文档当前正在通过 推测规则 API 启动的预渲染过程中,则返回 true

布尔值。如果文档当前正在预渲染过程中,则返回 true;否则返回 false。对于已完成预渲染的文档和未进行预渲染的文档,都将返回 false

示例

要在页面预渲染时运行活动,可以检查 prerendering 属性。例如,可以运行一些分析

js
if (document.prerendering) {
  analytics.sendInfo("got this far during prerendering!");
}

当预渲染文档被激活时,PerformanceNavigationTiming.activationStart 将设置为一个 DOMHighResTimeStamp 值,该值表示从开始预渲染到文档实际激活之间的时间。以下函数可以检查预渲染预渲染页面

js
function pagePrerendered() {
  return (
    document.prerendering ||
    self.performance?.getEntriesByType?.("navigation")[0]?.activationStart > 0
  );
}

当用户查看页面时激活预渲染页面时,将触发 prerenderingchange 事件。这可以用来启用在页面加载时默认启动但在您希望延迟到用户实际查看页面时才启动的活动。以下代码设置了一个事件侦听器,在预渲染完成后(在预渲染页面上)运行一个函数,或者在非预渲染页面上立即运行该函数

js
if (document.prerendering) {
  document.addEventListener("prerenderingchange", initAnalytics, {
    once: true,
  });
} else {
  initAnalytics();
}

注意:有关您可能希望延迟的活动类型,请参阅 推测规则 API 着陆页,特别是 不安全的推测性加载条件 部分。

规范

规范
预渲染改进
# dom-document-prerendering

浏览器兼容性

BCD 表格仅在浏览器中加载

另请参阅