Chrome预渲染：如何推迟javascript直到实际加载页面？

Question

我正在使用Chrome页面预渲染：

<link rel="prerender" href="nextpage.html">

我的问题是在nextpage.html上我有一个javascript（notify.js），它会显示几秒钟的通知弹出窗口。由于javascript是预渲染的，因此用户实际上从未看到过通知（它显示在隐藏的预呈现选项卡中）。

有没有一种方法可以表明特定的javascript只在实际页面显示上执行而不是在预先呈现的页面上执行？看看Chrome documentation我看到了一些关于“插件延迟”但没有关于javascript的明确说明。

Answer 1

我认为您可以推迟通知功能，直到使用Page Visibility API显示页面。

因此，基本上尝试订阅visibilitychange事件并在其可见时触发必要的操作。也许您需要额外的标志才能通知一次：

let alreadyNotified = false

document.addEventListener('visibilitychange', function() {
  if (!document.hidden && !alreadyNotified) {
    // run notification
    alreadyNotified = true
  }
})