PerformanceEntry
Baseline
Weitgehend verfügbar
Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit September 2017 browserübergreifend verfügbar.
Hinweis: Diese Funktion ist in Web Workers verfügbar.
Das PerformanceEntry-Objekt kapselt eine einzelne Leistungsmetrik, die Teil der Leistungschronologie 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, Event-Timing 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 Leistungschronologie hinzuzufügen.
Die PerformanceEntry-Instanzen werden immer eine der folgenden Unterklassen sein:
InteractionContentfulPaintLargestContentfulPaintLayoutShiftPerformanceContainerTimingPerformanceElementTimingPerformanceEventTimingPerformanceLongAnimationFrameTimingPerformanceLongTaskTimingPerformanceMarkPerformanceMeasurePerformanceNavigationTimingPerformancePaintTimingPerformanceResourceTimingPerformanceScriptTimingPerformanceSoftNavigationTaskAttributionTimingVisibilityStateEntry
Instanz-Eigenschaften
PerformanceEntry.nameSchreibgeschützt-
Ein String, der den Namen eines Performance-Eintrags darstellt. Der Wert hängt vom Untertyp ab.
PerformanceEntry.durationSchreibgeschützt-
Ein
DOMHighResTimeStamp, der die Dauer des Performance-Eintrags darstellt. PerformanceEntry.entryTypeSchreibgeschützt-
Ein String, der den Typ der Leistungsmetrik darstellt. Zum Beispiel
"mark", wennPerformanceMarkverwendet wird. -
Die ID der Navigation, unter der der Performance-Eintrag ausgegeben wurde.
PerformanceEntry.startTimeSchreibgeschützt-
Ein
DOMHighResTimeStamp, der die Startzeit für die Leistungsmetrik darstellt.
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 der Typen PerformanceMark und PerformanceMeasure.
Die Unterklassen PerformanceMark und PerformanceMeasure erben die Eigenschaften duration, entryType, name und startTime von PerformanceEntry und setzen sie auf ihre entsprechenden 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
| Spezifikation |
|---|
| Performance Timeline # performanceentry |