LayoutShift: hadRecentInput-Eigenschaft

Die hadRecentInput-Eigenschaft der LayoutShift-Schnittstelle gibt true zurück, wenn lastInputTime weniger als 500 Millisekunden in der Vergangenheit liegt.

Layout-Verschiebungen sind nur ein Problem, wenn der Benutzer sie nicht erwartet. Layout-Verschiebungen, die durch Benutzerinteraktionen (z.B. ein Benutzer erweitert ein UI-Element) verursacht werden, werden häufig nicht in Layout-Verschiebungsmetriken berücksichtigt. Die hadRecentInput-Eigenschaft ermöglicht es Ihnen, diese Verschiebungen auszuschließen.

Wert

Ein boolescher Wert, der true zurückgibt, wenn lastInputTime weniger als 500 Millisekunden in der Vergangenheit liegt; andernfalls false.

Beispiele

Ignorieren von kürzlich erfolgten Benutzereingaben bei Layout-Verschiebungswerten

Das folgende Beispiel zeigt, wie die hadRecentInput-Eigenschaft verwendet wird, um nur Layout-Verschiebungen ohne kürzliche Benutzereingaben zu zählen.

const observer = new PerformanceObserver((list) => {
 for (const entry of list.getEntries()) {
 // Count layout shifts without recent user input only
 if (!entry.hadRecentInput) {
 console.log("LayoutShift value:", entry.value);
 if (entry.sources) {
 for (const { node, currentRect, previousRect } of entry.sources)
 console.log("LayoutShift source:", node, {
 currentRect,
 previousRect,
 });
 }
 }
 }
});
observer.observe({ type: "layout-shift", buffered: true });

Spezifikationen

Browser-Kompatibilität

Siehe auch

• LayoutShift.lastInputTime