PerformanceEntry

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015.

Hinweis: Diese Funktion ist in Web Workers verfügbar.

Das PerformanceEntry-Objekt kapselt eine einzelne Leistungsmetrik, die Teil der Leistungstimeline des Browsers ist.

Die Performance API bietet integrierte Metriken, die spezialisierte Unterklassen von PerformanceEntry sind. Dazu gehören Einträge für Ressourcenladezeiten, Ereigniszeiten, First Input Delay (FID) und mehr.

Ein Performance-Eintrag kann auch erstellt werden, indem die Methoden Performance.mark() oder Performance.measure() zu einem bestimmten Zeitpunkt in einer Anwendung aufgerufen werden. Dies ermöglicht es Ihnen, eigene Metriken zur Leistungstimeline hinzuzufügen.

Die Instanzen von PerformanceEntry werden immer eine der folgenden Unterklassen sein:

Instanz-Eigenschaften

PerformanceEntry.name Schreibgeschützt: Ein String, der den Namen für einen Performance-Eintrag repräsentiert. Der Wert hängt vom Untertyp ab.
PerformanceEntry.entryType Schreibgeschützt: Ein String, der den Typ der Leistungsmetrik repräsentiert. Zum Beispiel "mark", wenn PerformanceMark verwendet wird.
PerformanceEntry.startTime Schreibgeschützt: Ein DOMHighResTimeStamp, der die Startzeit für die Leistungsmetrik repräsentiert.
PerformanceEntry.duration Schreibgeschützt: Ein DOMHighResTimeStamp, der die Dauer des Performance-Eintrags repräsentiert.

Instanz-Methoden

PerformanceEntry.toJSON(): Gibt eine JSON-Darstellung des PerformanceEntry-Objekts zurück.

Beispiel

Arbeiten mit Performance-Einträgen

Das folgende Beispiel erstellt PerformanceEntry-Objekte, die von den Typen PerformanceMark und PerformanceMeasure sind. Die Unterklassen PerformanceMark und PerformanceMeasure erben die Eigenschaften duration, entryType, name und startTime von PerformanceEntry und setzen sie auf ihre jeweiligen Werte.

// Place at a location in the code that starts login
performance.mark("login-started");

// Place at a location in the code that finishes login
performance.mark("login-finished");

// Measure login duration
performance.measure("login-duration", "login-started", "login-finished");

function perfObserver(list, observer) {
  list.getEntries().forEach((entry) => {
    if (entry.entryType === "mark") {
      console.log(`${entry.name}'s startTime: ${entry.startTime}`);
    }
    if (entry.entryType === "measure") {
      console.log(`${entry.name}'s duration: ${entry.duration}`);
    }
  });
}
const observer = new PerformanceObserver(perfObserver);
observer.observe({ entryTypes: ["measure", "mark"] });

Spezifikationen

Specification
Performance Timeline # dom-performanceentry

Browser-Kompatibilität

BCD tables only load in the browser