PerformanceLongAnimationFrameTiming

Beschreibung

Lange Animationsframes (LoAFs) sind Rendering-Aktualisierungen, die über 50 ms hinaus verzögert werden. LoAFs können langsame Benutzeroberflächen (UI) Updates verursachen, wodurch Steuerelemente unempfänglich erscheinen und ruckelige (nicht flüssige) Animationseffekte und Bildläufe entstehen. Dies führt oft zu Benutzungsfrust.

Die PerformanceLongAnimationFrameTiming-Schnittstelle bietet den folgenden detaillierten Satz von Informationen zu LoAFs, sodass Entwickler deren Ursachen eingrenzen können:

• Einen detaillierten Satz von Zeitstempeln für jedes LoAF.
• Detaillierte Informationen zu jedem Script, das zur Entstehung des LoAF beigetragen hat, über die PerformanceLongAnimationFrameTiming.scripts-Eigenschaft. Dies gibt ein Array von PerformanceScriptTiming-Objekten zurück, jeweils eines für jedes Skript.

PerformanceLongAnimationFrameTiming erbt von PerformanceEntry.

Instanz-Eigenschaften

Diese Schnittstelle definiert direkt die folgenden Eigenschaften:

PerformanceLongAnimationFrameTiming.blockingDuration Schreibgeschützt Experimentell

Gibt einen DOMHighResTimeStamp zurück, der die Gesamtzeit in Millisekunden angibt, die der Hauptthread daran gehindert wurde, auf hochpriorisierte Aufgaben wie Benutzereingaben zu reagieren. Dies wird berechnet, indem alle Lange Aufgaben innerhalb des LoAF, die eine duration von mehr als 50ms haben, genommen werden, 50ms von jedem abgezogen wird, die Rendering-Zeit zur längsten Aufgabenzeit hinzugefügt wird und die Ergebnisse summiert werden.

PerformanceLongAnimationFrameTiming.firstUIEventTimestamp Schreibgeschützt Experimentell

Gibt einen DOMHighResTimeStamp zurück, der den Zeitpunkt des ersten UI-Ereignisses — wie ein Maus- oder Tastaturereignis — angibt, das während des aktuellen Animationsframes in die Warteschlange gestellt wurde.

PerformanceLongAnimationFrameTiming.paintTime Experimentell

Gibt den zeitstempel zurück, als die Rendering-Phase endete und der Animationsframe startete.

PerformanceLongAnimationFrameTiming.presentationTime Experimentell

Gibt den zeitstempel zurück, als das UI-Update tatsächlich auf dem Bildschirm gezeichnet wurde.

PerformanceLongAnimationFrameTiming.renderStart Schreibgeschützt Experimentell

Gibt einen DOMHighResTimeStamp zurück, der den Startzeitpunkt des Rendering-Zyklus angibt, welcher Window.requestAnimationFrame()-Rückrufe, Stil- und Layout-Berechnungen, ResizeObserver-Rückrufe und IntersectionObserver-Rückrufe einschließt.

PerformanceLongAnimationFrameTiming.scripts Schreibgeschützt Experimentell

Gibt ein Array von PerformanceScriptTiming-Instanzen zurück.

PerformanceLongAnimationFrameTiming.styleAndLayoutStart Schreibgeschützt Experimentell

Gibt einen DOMHighResTimeStamp zurück, der den Anfangszeitpunkt des Zeitraums angibt, der für Stil- und Layout-Berechnungen für den aktuellen Animationsframe aufgewendet wurde.

Es erweitert auch die folgenden PerformanceEntry-Eigenschaften und qualifiziert und beschränkt sie wie beschrieben:

PerformanceEntry.duration Schreibgeschützt Experimentell

Gibt einen DOMHighResTimeStamp zurück, der die Zeit in Millisekunden darstellt, die benötigt wird, um den LoAF vollständig zu verarbeiten.

PerformanceEntry.entryType Schreibgeschützt Experimentell

Gibt den Eintragstyp zurück, welcher immer "long-animation-frame" ist.

PerformanceEntry.name Schreibgeschützt Experimentell

Gibt den Eintragsnamen zurück, welcher immer "long-animation-frame" ist.

PerformanceEntry.startTime Schreibgeschützt Experimentell

Gibt einen DOMHighResTimeStamp zurück, der den Zeitpunkt darstellt, zu dem der Animationsframe gestartet wurde.

Instanz-Methoden

PerformanceLongAnimationFrameTiming.toJSON() Experimentell

Gibt eine JSON-Darstellung des PerformanceLongAnimationFrameTiming-Objekts zurück.

Beispiele

Siehe Long animation frame timing für Beispiele im Zusammenhang mit der Long Animation Frames API.

Spezifikationen

Browser-Kompatibilität

Siehe auch

• Long animation frame timing
• PerformanceScriptTiming