PerformanceEntry: name-Eigenschaft

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015.

Hinweis: Diese Funktion ist in Web Workers verfügbar.

Die schreibgeschützte name-Eigenschaft des PerformanceEntry-Interfaces ist ein String, der den Namen eines Performance-Eintrags darstellt. Er fungiert als eine Art Identifikator, muss jedoch nicht eindeutig sein. Der Wert hängt von der jeweiligen Unterklasse ab.

Wert

Ein String. Der Wert hängt von der Unterklasse des PerformanceEntry-Objekts ab, wie in der folgenden Tabelle gezeigt.

Unterklasse Wert
[`LargestContentfulPaint`](/de/docs/Web/API/LargestContentfulPaint) Liefert immer einen leeren String zurück.
[`LayoutShift`](/de/docs/Web/API/LayoutShift) Liefert immer "layout-shift" zurück.
[`PerformanceElementTiming`](/de/docs/Web/API/PerformanceElementTiming) Einer der folgenden Strings:
  • "image-paint"
  • "text-paint"
[`PerformanceEventTiming`](/de/docs/Web/API/PerformanceEventTiming) Der Typ des zugehörigen Events.
[`PerformanceLongTaskTiming`](/de/docs/Web/API/PerformanceLongTaskTiming) Einer der folgenden Strings:
  • "cross-origin-ancestor"
  • "cross-origin-descendant"
  • "cross-origin-unreachable"
  • "multiple-contexts"
  • "same-origin-ancestor"
  • "same-origin-descendant"
  • "same-origin"
  • "self"
  • "unknown"
[`PerformanceMark`](/de/docs/Web/API/PerformanceMark) Der Name, der verwendet wurde, als die Markierung durch Aufruf von [`performance.mark()`](/de/docs/Web/API/Performance/mark) erstellt wurde.
[`PerformanceMeasure`](/de/docs/Web/API/PerformanceMeasure) Der Name, der verwendet wurde, als die Messung durch Aufruf von [`performance.measure()`](/de/docs/Web/API/Performance/measure) erstellt wurde.
[`PerformanceNavigationTiming`](/de/docs/Web/API/PerformanceNavigationTiming) Die aufgelöste URL der angeforderten Ressource. Beachten Sie, dass hierbei keine Textfragmente oder andere Fragmentanweisungen enthalten sind. Der Wert ändert sich nicht, auch wenn die Anfrage umgeleitet wird.
[`PerformancePaintTiming`](/de/docs/Web/API/PerformancePaintTiming) Einer der folgenden Strings:
  • "first-paint"
  • "first-contentful-paint"
[`PerformanceResourceTiming`](/de/docs/Web/API/PerformanceResourceTiming) Die aufgelöste URL der angeforderten Ressource. Dieser Wert ändert sich nicht, auch wenn die Anfrage umgeleitet wird.
[`TaskAttributionTiming`](/de/docs/Web/API/TaskAttributionTiming) Liefert immer "unknown" zurück.
[`VisibilityStateEntry`](/de/docs/Web/API/VisibilityStateEntry) Einer der folgenden Strings:
  • "visible"
  • "hidden"

Beispiele

Filtern von Performance-Einträgen nach Namen

Wenn das PerformanceEntry ein PerformanceResourceTiming-Objekt ist, bezieht sich die name-Eigenschaft auf die aufgelöste URL der angeforderten Ressource. In diesem Fall kann die name-Eigenschaft nützlich sein, um bestimmte Ressourcen herauszufiltern, zum Beispiel alle SVG-Bilder.

js
// Log durations of SVG resources
performance.getEntriesByType("resource").forEach((entry) => {
  if (entry.name.endsWith(".svg")) {
    console.log(`${entry.name}'s duration: ${entry.duration}`);
  }
});

Abrufen von Performance-Einträgen nach Namen

Sowohl Performance als auch PerformanceObserver bieten Methoden, mit denen Sie Performance-Einträge direkt nach Namen abrufen können. Sie müssen die name-Eigenschaft dafür nicht unbedingt verwenden, sondern können stattdessen Performance.getEntriesByName() oder PerformanceObserverEntryList.getEntriesByName() verwenden.

js
// Log all marks named "debug-marks" at this point in time
const debugMarks = performance.getEntriesByName("debug-mark", "mark");
debugMarks.forEach((entry) => {
  console.log(`${entry.name}'s startTime: ${entry.startTime}`);
});

// PerformanceObserver version
// Log all marks named "debug-marks" when they happen
function perfObserver(list, observer) {
  list.getEntriesByName("debug-mark", "mark").forEach((entry) => {
    console.log(`${entry.name}'s startTime: ${entry.startTime}`);
  });
}
const observer = new PerformanceObserver(perfObserver);
observer.observe({ entryTypes: ["measure", "mark"] });

Spezifikationen

Specification
Performance Timeline
# dom-performanceentry-name

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch