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 eingebaute Metriken, die spezialisierte Unterklassen von PerformanceEntry
sind. Dazu gehören Einträge für das Laden von Ressourcen, Ereignis-Timing und mehr.
Ein Leistungseintrag kann auch erstellt werden, indem die Methoden Performance.mark()
oder Performance.measure()
zu einem expliziten Zeitpunkt in einer Anwendung aufgerufen werden. Dies ermöglicht das Hinzufügen eigener Metriken zur Leistungstimeline.
Die Instanzen von PerformanceEntry
werden immer eine der folgenden Unterklassen sein:
LargestContentfulPaint
LayoutShift
PerformanceEventTiming
PerformanceLongAnimationFrameTiming
PerformanceLongTaskTiming
PerformanceMark
PerformanceMeasure
PerformanceNavigationTiming
PerformancePaintTiming
PerformanceResourceTiming
PerformanceScriptTiming
PerformanceServerTiming
TaskAttributionTiming
VisibilityStateEntry
Instanz-Eigenschaften
PerformanceEntry.name
Schreibgeschützt-
Ein String, der den Namen eines Leistungseintrags darstellt. Der Wert hängt vom Subtyp ab.
PerformanceEntry.entryType
Schreibgeschützt-
Ein String, der den Typ der Leistungsmetrik darstellt. Zum Beispiel
"mark"
, wennPerformanceMark
verwendet wird. PerformanceEntry.startTime
Schreibgeschützt-
Ein
DOMHighResTimeStamp
, der die Startzeit für die Leistungsmetrik darstellt. PerformanceEntry.duration
Schreibgeschützt-
Ein
DOMHighResTimeStamp
, der die Dauer des Leistungseintrags darstellt.
Instanz-Methoden
PerformanceEntry.toJSON()
-
Gibt eine JSON-Repräsentation des
PerformanceEntry
-Objekts zurück.
Beispiel
Arbeiten mit Leistungseinträ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