Hinweis: Diese Funktion ist in Web Workers verfügbar.
Die Performance-API ist eine Gruppe von Standards, die verwendet werden, um die Leistung von Webanwendungen zu messen.
Konzepte und VerwendungUm sicherzustellen, dass Webanwendungen schnell sind, ist es wichtig, verschiedene Leistungskennzahlen zu messen und zu analysieren. Die Performance-API bietet wichtige integrierte Metriken und die Möglichkeit, eigene Messungen zur Leistungstimeline des Browsers hinzuzufügen. Die Leistungstimeline enthält hochpräzise Zeitstempel und kann in Entwickler-Tools angezeigt werden. Sie können deren Daten auch an Analyse-Endpunkte senden, um Leistungskennzahlen im Laufe der Zeit zu protokollieren.
Jede Leistungskennzahl wird durch einen einzelnen PerformanceEntry
dargestellt. Ein Leistungs-Eintrag hat einen name
, eine duration
, eine startTime
und einen type
. Alle Leistungskennzahlen erweitern das PerformanceEntry
-Interface und qualifizieren es weiter.
Die meisten der Leistungseinträge werden für Sie aufgezeichnet, ohne dass Sie etwas tun müssen, und sind entweder über Performance.getEntries()
oder (bevorzugt) über PerformanceObserver
zugänglich. Zum Beispiel werden PerformanceEventTiming
-Einträge für Ereignisse aufgezeichnet, die länger als ein festgelegter Schwellenwert dauern. Aber die Performance-API ermöglicht es Ihnen auch, eigene benutzerdefinierte Ereignisse zu definieren und aufzuzeichnen, indem Sie die Schnittstellen PerformanceMark
und PerformanceMeasure
verwenden.
Die Hauptschnittstelle Performance
ist sowohl in den globalen Bereichen Window
als auch Worker
verfügbar und ermöglicht es Ihnen, benutzerdefinierte Leistungseinträge hinzuzufügen, Leistungseinträge zu löschen und Leistungseinträge abzurufen.
Die Schnittstelle PerformanceObserver
ermöglicht es Ihnen, verschiedenen Arten von Leistungseinträgen zuzuhören, sobald sie aufgezeichnet werden.
Für weitere konzeptionelle Informationen siehe die Leitfäden zur Performance-API unten.
ReferenzDie folgenden Schnittstellen sind in der Performance-API vorhanden:
EventCounts
Eine schreibgeschützte Abbildung, die von performance.eventCounts
zurückgegeben wird und die Anzahl der Ereignisse enthält, die pro Ereignistyp gesendet wurden.
LargestContentfulPaint
Misst die Renderzeit des gröÃten sichtbaren Bildes oder Textblocks innerhalb des Viewports, aufgezeichnet ab dem Zeitpunkt, an dem die Seite anfängt zu laden.
LayoutShift
Bietet Einblicke in die Layoutstabilität von Webseiten basierend auf Bewegungen der Elemente auf der Seite.
LayoutShiftAttribution
Bietet Debug-Informationen über Elemente, die sich verschoben haben.
NotRestoredReasonDetails
Repräsentiert einen einzelnen Grund, warum eine navigierte Seite daran gehindert wurde, den Back/Forward-Cache (bfcache) zu nutzen.
NotRestoredReasons
Bietet Berichtsdaten mit Gründen, warum das aktuelle Dokument daran gehindert wurde, den Back/Forward-Cache (bfcache) bei der Navigation zu nutzen.
Performance
Hauptschnittstelle zum Zugriff auf Leistungsdaten. Verfügbar in Fenster- und Worker-Kontexten über Window.performance
oder WorkerGlobalScope.performance
.
PerformanceElementTiming
Misst Rendering-Zeitstempel spezifischer Elemente.
PerformanceEntry
Ein Eintrag in der Leistungstimeline, der eine einzelne Leistungskennzahl einkapselt. Alle Leistungskennzahlen erben von diesem Interface.
PerformanceEventTiming
Misst Latenz von Ereignissen und Interaction to Next Paint (INP).
PerformanceLongAnimationFrameTiming
Bietet Metriken zu langen Animationsbildern (LoAFs), die das Rendering auslasten und andere Aufgaben blockieren.
PerformanceLongTaskTiming
Bietet Metriken zu langen Aufgaben, die das Rendering auslasten und andere Aufgaben blockieren.
PerformanceMark
Benutzerdefinierter Marker für Ihren eigenen Eintrag in der Leistungstimeline.
PerformanceMeasure
Benutzerdefinierte Zeitmessung zwischen zwei Leistungseinträgen.
PerformanceNavigationTiming
Misst Dokumentnavigationsereignisse, wie die Zeit, die benötigt wird, um ein Dokument zu laden.
PerformanceObserver
Lauscht auf neue Leistungseinträge, sobald sie in der Leistungstimeline aufgezeichnet werden.
PerformanceObserverEntryList
Liste von Einträgen, die in einem Performance Observer beobachtet wurden.
PerformancePaintTiming
Misst Render-Operationen während des Aufbaus einer Webseite.
PerformanceResourceTiming
Misst Netzwerk-Lademetriken wie Redirect-Start- und Endzeiten, Fetch-Start, DNS-Lookup-Start- und Endzeiten, Antwort-Start- und Endzeiten für Ressourcen wie Bilder, Skripte, Fetch-Aufrufe usw.
PerformanceScriptTiming
Bietet Metriken zu einzelnen Skripten, die lange Animationsbilder (LoAFs) verursachen.
PerformanceServerTiming
Zeigt Servermetriken an, die mit der Antwort im Server-Timing
HTTP-Header gesendet werden.
TaskAttributionTiming
Identifiziert den Aufgabentyp und den Container, der für die lange Aufgabe verantwortlich ist.
VisibilityStateEntry
Misst das Timing von Ãnderungen des Sichtbarkeitsstatus der Seite, d.h. wenn ein Tab von Vordergrund zu Hintergrund oder umgekehrt wechselt.
Die folgenden Leitfäden helfen Ihnen, die Schlüsselkonzepte der Performance-API zu verstehen und bieten einen Ãberblick über ihre Fähigkeiten:
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4