PerformanceEntry: startTime-Eigenschaft

Wert

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

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

element

Entweder der Wert von renderTime dieses Eintrags, falls er nicht 0 ist, andernfalls der Wert von loadTime dieses Eintrags.

event

Der Zeitpunkt, zu dem das Ereignis erstellt wurde, d.h. die Eigenschaft timeStamp des Ereignisses.

first-input

Der Zeitpunkt, zu dem das erste Eingabeereignis erstellt wurde, d.h. der timeStamp dieses Ereignisses.

largest-contentful-paint

Der Wert von renderTime dieses Eintrags, falls er nicht 0 ist, andernfalls der Wert von loadTime dieses Eintrags.

layout-shift

Der Zeitpunkt, zu dem die Layoutverschiebung begann.

longtask

Der Zeitpunkt, zu dem die Aufgabe begann.

mark

Der Zeitpunkt, zu dem die Markierung durch einen Aufruf von performance.mark() erstellt wurde.

measure

Der Zeitpunkt, zu dem die Messung durch einen Aufruf von performance.measure() erstellt wurde.

navigation

Immer 0.

paint

Der Zeitpunkt, zu dem das Zeichnen erfolgte.

resource

Der Zeitpunkt, zu dem das Abrufen der Ressource begann, einschließlich Weiterleitungen. Wenn keine HTTP-Weiterleitungen vorhanden sind oder deren Zeitinformationen nicht verfügbar gemacht werden, entspricht dieser Wert PerformanceResourceTiming.fetchStart. Andernfalls kann dieser Wert früher als fetchStart liegen.

taskattribution

Immer 0.

visibility-state

Der Zeitpunkt, zu dem die Änderung des Sichtbarkeitsstatus erfolgte.

Beispiele

Verwendung der startTime-Eigenschaft

Das folgende Beispiel zeigt die Verwendung der startTime-Eigenschaft, die Sie während der Performance-Beobachtung protokollieren können.

Hinweis: Die Methode performance.mark() ermöglicht es Ihnen, Ihre eigene startTime festzulegen, und die Methode performance.measure() ermöglicht es Ihnen, den Beginn der Messung festzulegen.

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