PerformanceObserverEntryList.getEntriesByType() — Methode · JavaScript-Referenz

Signatur

PerformanceObserverEntryList.prototype.getEntriesByType(type)

Beschreibung

getEntriesByType() wird innerhalb des Callbacks eines PerformanceObserver auf der übergebenen PerformanceObserverEntryList aufgerufen. Die Methode filtert die in diesem Aufruf gelieferten Einträge nach ihrem entryType, z. B. "resource", "mark", "measure", "navigation", "paint", "longtask" oder "largest-contentful-paint".

Das ist vor allem dann nützlich, wenn ein einzelner Observer mehrere Typen gleichzeitig beobachtet (observe({ entryTypes: ["mark", "measure"] })) und Sie die Einträge im Callback getrennt verarbeiten möchten. Beobachtet der Observer nur einen Typ, liefert getEntries() dasselbe Ergebnis.

Anders als performance.getEntriesByType() arbeitet diese Methode nicht auf der globalen Performance-Timeline, sondern nur auf dem Stapel von Einträgen, die dem Observer seit dem letzten Callback-Aufruf zugestellt wurden. Die Einträge sind chronologisch nach startTime sortiert.

Parameter

Name	Typ	Default	Beschreibung
$type Pflicht	string		Der gesuchte Eintragstyp, z. B. `"mark"`, `"measure"`, `"resource"`, `"paint"`. Gültige Werte liefert `PerformanceObserver.supportedEntryTypes`.

Rückgabewert

Typ

PerformanceEntry[]

Beschreibung

Ein Array von PerformanceEntry-Objekten (bzw. Unterklassen wie PerformanceResourceTiming) mit passendem entryType, sortiert nach startTime. Gibt es keine Treffer, wird ein leeres Array zurückgegeben.

Beispiele

Marks und Measures in einem Observer trennen

const observer = new PerformanceObserver((list) => {
  // Nur die Messungen herausfiltern
  for (const entry of list.getEntriesByType('measure')) {
    console.log(`Messung ${entry.name}: ${entry.duration.toFixed(1)} ms`);
  }
  // Marks separat zählen
  console.log('Marks im Stapel:', list.getEntriesByType('mark').length);
});

observer.observe({ entryTypes: ['mark', 'measure'] });

performance.mark('start');
for (let i = 0; i < 1e6; i++); // Arbeit simulieren
performance.mark('ende');
performance.measure('schleife', 'start', 'ende');

Messung schleife: 3.2 ms Marks im Stapel: 2

Langsame Ressourcen erkennen

const observer = new PerformanceObserver((list) => {
  const langsam = list
    .getEntriesByType('resource')
    .filter((e) => e.duration > 500)
    .map((e) => ({ url: e.name, ms: Math.round(e.duration) }));

  if (langsam.length > 0) {
    console.table(langsam);
  }
});

// buffered: true liefert auch bereits geladene Ressourcen
observer.observe({ type: 'resource', buffered: true });

Tabelle mit URLs und Ladezeiten > 500 ms

Unbekannter Typ liefert leeres Array

const observer = new PerformanceObserver((list) => {
  console.log(list.getEntriesByType('gibt-es-nicht'));
  observer.disconnect();
});
observer.observe({ type: 'mark' });
performance.mark('test');

[]

// Wichtig · Fallstricke

Nur der aktuelle Stapel: Die Liste enthält ausschließlich Einträge, die dem Callback in diesem Aufruf zugestellt wurden – nicht die gesamte Timeline. Für alle bisherigen Einträge nutzen Sie performance.getEntriesByType() oder observe({ type, buffered: true }).
Der Typ-Vergleich ist exakt und case-sensitiv; ein Tippfehler führt zu einem leeren Array statt zu einem Fehler.
Nicht alle Typen werden überall unterstützt (z. B. "longtask", "layout-shift", "largest-contentful-paint" nur in Chromium-Browsern). Prüfen Sie vorab mit PerformanceObserver.supportedEntryTypes.
entryTypes und type/buffered lassen sich in observe() nicht kombinieren; für mehrere Typen mit buffered rufen Sie observe() mehrfach auf.
Auch in Web Workern verfügbar; in Node.js über perf_hooks.

Siehe auch

PerformanceObserverEntryList.getEntries() PerformanceObserverEntryList.getEntriesByName() Performance.getEntriesByType() Performance.getEntriesByName() PerformanceObserver.disconnect()