PerformanceEntry: startTime-Eigenschaft

Wert

Ein DOMHighResTimeStamp, der den ersten Zeitstempel darstellt, als der PerformanceEntry erstellt wurde.

Die Bedeutung dieser Eigenschaft hängt vom Wert des entryType dieses Performance-Eintrags ab:

element

Entweder der Wert des renderTime dieses Eintrags, wenn er nicht 0 ist, andernfalls der Wert des loadTime dieses Eintrags.

event

Die Zeit, zu der das Ereignis erstellt wurde, d.h. die timeStamp-Eigenschaft des Ereignisses.

first-input

Die Zeit, zu der das erste Eingabeereignis erstellt wurde, d.h. die timeStamp-Eigenschaft dieses Ereignisses.

largest-contentful-paint

Der Wert des renderTime dieses Eintrags, wenn er nicht 0 ist, andernfalls der Wert des loadTime dieses Eintrags.

layout-shift

Die Zeit, zu der die Layout-Verschiebung begann.

longtask

Die Zeit, zu der die Aufgabe begann.

mark

Die Zeit, zu der die Markierung durch einen Aufruf von performance.mark() erstellt wurde.

measure

Die Zeit, zu der die Messung durch einen Aufruf von performance.measure() erstellt wurde.

navigation

Immer 0.

paint

Die Zeit, zu der das Rendering stattfand.

resource

Der Wert der fetchStart-Eigenschaft dieses Eintrags.

taskattribution

Immer 0.

visibility-state

Die Zeit, zu der die Änderung des Sichtbarkeitszustands erfolgte.

Beispiele

Verwendung der startTime-Eigenschaft

Das folgende Beispiel zeigt die Verwendung der startTime-Eigenschaft, die während der Performance-Beobachtung protokolliert werden kann.

performance.mark("my-mark");
performance.mark("my-other-mark", { startTime: 12.5 });

loginButton.addEventListener("click", (clickEvent) => {
  performance.measure("login-click", { start: clickEvent.timeStamp });
});

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

Browser-Kompatibilität