Документ: свойство prerendering

Свойство prerendering только для чтения интерфейса Document возвращает true, если документ в данный момент находится в процессе предварительной отрисовки, инициированной через API правил упреждения.

Булево значение. Возвращает true, если документ находится в процессе предварительной отрисовки, и false, если нет. false будет возвращено для документов, которые завершили предварительную отрисовку, и документов, которые не подвергались предварительной отрисовке.

Чтобы запустить действие во время предварительной отрисовки страницы, вы можете проверить свойство prerendering. Например, вы можете запустить некоторые аналитические данные:

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

Когда предварительно отрисованный документ активируется, PerformanceNavigationTiming.activationStart устанавливается в значение DOMHighResTimeStamp, представляющее время между началом предварительной отрисовки и фактической активацией документа. Следующая функция может проверять предварительную отрисовку и предварительно отрисованные страницы:

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

Когда пользователь активирует предварительно отрисованную страницу, событие prerenderingchange будет сгенерировано. Это можно использовать для активации действий, которые по умолчанию запускались при загрузке страницы, но которые вы хотите отложить до фактического просмотра страницы пользователем. Следующий код настраивает обработчик событий для выполнения функции после завершения предварительной отрисовки, для предварительно отрисованной страницы или выполнения ее сразу для неотрисованной страницы:

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

Чтобы измерить частоту активации предварительной отрисовки, объедините все три API: document.prerendering для обнаружения случаев, когда страница в настоящее время находится в процессе предварительной отрисовки, prerenderingchange для отслеживания активаций в этом случае и activationStart для проверки случаев, когда страница была предварительно отрисована в прошлом.

if (document.prerendering) {
  document.addEventListener(
    "prerenderingchange",
    () => {
      console.log("Prerender activated after this script ran");
    },
    { once: true },
  );
} else if (performance.getEntriesByType("navigation")[0]?.activationStart > 0) {
  console.log("Prerender activated before this script ran");
} else {
  console.log("This page load was not via prerendering");
}

• API правил упреждения
• prerenderingchange событие
• PerformanceNavigationTiming.activationStart свойство