Документ: событие prerenderingchange

Событие prerenderingchange срабатывает на пререндеренном документе при его активации (т.е. когда пользователь просматривает страницу).

Используйте имя события в методах, таких как addEventListener(), или задайте свойство обработчика события.

addEventListener("prerenderingchange", (event) => {});

prerenderingchange = (event) => {};

Общее Event.

Пример демонстрирует, как отложить выполнение кода, который в противном случае запускался бы во время пререндеринга, до активации страницы. Это полезно для отложенного запуска аналитического кода, который актуален только при фактическом просмотре страницы.

Код проверяет, выполняется ли пререндеринг с помощью Document.prerendering, и если да, добавляет обработчик события для запуска функции инициализации аналитики после активации страницы. На странице, которая не пререндерилась, код аналитики запускается немедленно.

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

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

Этот код показывает, как измерить частоту активации пререндеринга. Он использует prerenderingchange для отслеживания событий активации и Performance.getEntriesByType() для отслеживания активаций навигации.

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 правил спекуляций
• prerendering свойство
• PerformanceNavigationTiming.activationStart свойство