PerformanceNavigationTiming: unloadEventEnd-Eigenschaft

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since ⁨Oktober 2021⁩.

Die schreibgeschützte Eigenschaft unloadEventEnd gibt einen DOMHighResTimeStamp zurück, der den Zeitpunkt unmittelbar nach der Ausführung des unload-Ereignis-Handlers des vorherigen Dokuments darstellt.

Wert

Die Eigenschaft unloadEventEnd kann die folgenden Werte haben:

Einen DOMHighResTimeStamp, der den Zeitpunkt unmittelbar nach dem Abschluss des unload-Ereignis-Handlers des vorherigen Dokuments darstellt.
0, wenn es kein vorheriges Dokument gibt.
0, wenn die vorherige Seite auf einer anderen Herkunft war.

Beispiele

Messung der Zeit des `unload`-Ereignis-Handlers

Die unloadEventEnd-Eigenschaft kann verwendet werden, um zu messen, wie lange die Verarbeitung des unload-Ereignis-Handlers dauert.

Dies ist nützlich, um die Zeit lang andauernder unload-Ereignis-Handler zu messen.

window.addEventListener("unload", (event) => {
  // Some long running code
});

Beispiel unter Verwendung eines PerformanceObserver, der über neue navigation-Performance-Einträge benachrichtigt, sobald sie in der Performance-Timeline des Browsers aufgezeichnet werden. Verwenden Sie die Option buffered, um auf Einträge von vor der Erstellung des Observers zuzugreifen.

const observer = new PerformanceObserver((list) => {
  list.getEntries().forEach((entry) => {
    const unloadEventTime = entry.unloadEventEnd - entry.unloadEventStart;
    if (unloadEventTime > 0) {
      console.log(
        `${entry.name}: unload event handler time: ${unloadEventTime}ms`,
      );
    }
  });
});

observer.observe({ type: "navigation", buffered: true });

Beispiel unter Verwendung von Performance.getEntriesByType(), das nur die navigation-Performance-Einträge anzeigt, die zum Zeitpunkt des Aufrufs dieser Methode in der Performance-Timeline des Browsers vorhanden sind:

const entries = performance.getEntriesByType("navigation");
entries.forEach((entry) => {
  const loadEventTime = entry.unloadEventEnd - entry.unloadEventStart;
  if (unloadEventTime > 0) {
    console.log(`${entry.name}:
      load event handler time: ${unloadEventTime}ms`);
  }
});