PerformanceSoftNavigation: Methode getLargestInteractionContentfulPaint()
Eingeschränkt verfügbar
Diese Funktion ist nicht Baseline, da sie in einigen der am weitesten verbreiteten Browser nicht funktioniert.
Want more browser support for this feature? Tell us why.
Experimentell: Dies ist eine experimentelle Technologie
Überprüfen Sie die Browser-Kompatibilitätstabelle sorgfältig vor der Verwendung auf produktiven Webseiten.
Die Methode getLargestInteractionContentfulPaint() der Schnittstelle PerformanceSoftNavigation gibt den aktuell größten InteractionContentfulPaint-Eintrag zurück, der für diese Soft Navigation relevant ist.
Einige Single-Page-Anwendungen (SPAs) zeichnen möglicherweise zuerst Inhalte und aktualisieren erst danach die URL. Dennoch möchten Entwickler diese Zeichenvorgänge berücksichtigen, wenn sie den Largest Contentful Paint (LCP) für Soft Navigations messen. Da eine Interaktion mit gezeichneten Inhalten auch erst zu einem beliebigen späteren Zeitpunkt eine URL-Aktualisierung und damit eine Soft Navigation auslösen kann, wäre dies schwer zu messen, ohne vorsorglich eine temporäre Referenz auf den LCP jeder Interaktion zu speichern.
Die Methode getLargestInteractionContentfulPaint() erspart Entwicklern dies, indem sie den neuesten und größten InteractionContentfulPaint-Eintrag für die Soft Navigation bereitstellt.
Sie ist als Methode und nicht als statische Eigenschaft definiert, weil sie den neuesten und größten Eintrag zurückgibt. Daher kann sie im Laufe der Zeit unterschiedliche Ergebnisse liefern, wenn nach der Soft Navigation größere InteractionContentfulPaint-Einträge erfasst werden.
Syntax
getLargestInteractionContentfulPaint()
Parameter
Keine.
Rückgabewert
Ein InteractionContentfulPaint-Objekt, das den größten InteractionContentfulPaint-Eintrag für diese Soft Navigation darstellt.
Beispiele
Die Methode getLargestInteractionContentfulPaint verwenden
In diesem Beispiel gibt der Aufruf von entry.getLargestInteractionContentfulPaint() eine JSON-Darstellung des LargestContentfulPaint-Objekts zurück.
const observer = new PerformanceObserver((list) => {
for (const entry of list.getEntries()) {
console.log(
"Soft Nav:",
entry.startTime,
entry.getLargestInteractionContentfulPaint(),
);
}
});
observer.observe({ type: "soft-navigation", buffered: true });
Um einen JSON-String zu erhalten, können Sie JSON.stringify(entry) direkt verwenden; dabei wird toJSON() automatisch aufgerufen.
Spezifikationen
| Spezifikation |
|---|
| Soft Navigations and Interaction Contentful Paint # dom-performancesoftnavigation-getlargestinteractioncontentfulpaint |