Performance.toJSON() — Methode · JavaScript-Referenz

Signatur

Performance.prototype.toJSON()

Beschreibung

performance.toJSON() ist der Standard-Serialisierer des Performance-Interfaces. Die Methode liefert ein gewöhnliches JavaScript-Objekt, in das die serialisierbaren Attribute der aktuellen Performance-Instanz kopiert werden. Das sind vor allem timeOrigin und in Fenster-Kontexten zusätzlich die älteren Objekte timing (PerformanceTiming) und navigation (PerformanceNavigation) sowie eventCounts.

Normalerweise ruft man die Methode nicht selbst auf. JSON.stringify(performance) erkennt die Methode toJSON() und ruft sie automatisch auf. Ohne diese Methode käme bei der Serialisierung eines Host-Objekts wie performance nur {} heraus, weil seine Eigenschaften als Getter auf dem Prototyp liegen und nicht als eigene aufzählbare Eigenschaften.

Nützlich ist die Methode, um eine Momentaufnahme der Zeitbasis und der Navigationsdaten zu protokollieren, sie an einen Analyse-Endpunkt zu senden oder in Tests und beim Debugging zu vergleichen. Die eigentlichen Performance-Einträge (Marks, Measures, Resource Timing usw.) sind nicht enthalten. Diese holt man über performance.getEntries() und die dazugehörigen Methoden.

Rückgabewert

Typ

object

Beschreibung

Ein einfaches Objekt mit den serialisierbaren Eigenschaften des Performance-Objekts, z. B. timeOrigin, timing, navigation und eventCounts. Welche Felder enthalten sind, hängt vom Kontext ab (Fenster oder Worker).

Beispiele

Serialisiertes Objekt direkt abrufen

const snapshot = performance.toJSON();

console.log(typeof snapshot);            // einfaches Objekt
console.log(Object.keys(snapshot));
console.log(snapshot.timeOrigin > 0);

object ["timeOrigin", "timing", "navigation", "eventCounts"] true

Automatischer Aufruf durch JSON.stringify()

// JSON.stringify ruft toJSON() automatisch auf
const json = JSON.stringify(performance, null, 2);
console.log(json);

// Zum Vergleich: ohne toJSON() wäre das Ergebnis leer
const ohneToJSON = JSON.stringify({ ...performance });
console.log(ohneToJSON);

{ "timeOrigin": 1718000000000.5, "timing": { "navigationStart": 1718000000000, ... }, "navigation": { "type": 0, "redirectCount": 0 }, "eventCounts": {} } {}

Performance-Momentaufnahme samt Einträgen an einen Analyse-Endpunkt senden

window.addEventListener('pagehide', () => {
  const { timeOrigin, navigation } = performance.toJSON();

  // Einträge sind NICHT in toJSON() enthalten und werden separat serialisiert
  const navEntry = performance.getEntriesByType('navigation')[0]?.toJSON();
  const measures = performance.getEntriesByType('measure').map((m) => m.toJSON());

  const payload = JSON.stringify({
    url: location.href,
    timeOrigin,
    navigationType: navigation?.type,
    navEntry,
    measures,
  });

  navigator.sendBeacon('/api/perf', payload);
});

Nutzung im Web Worker

// worker.js
const data = performance.toJSON();
// Im Worker gibt es weder timing noch navigation
self.postMessage(data);

// main.js
const worker = new Worker('worker.js');
worker.onmessage = (event) => console.log(event.data);

{ timeOrigin: 1718000000123.4 }

// Wichtig · Fallstricke

Keine Einträge enthalten: Marks, Measures, Resource- und Navigation-Einträge landen nicht im Ergebnis. Nutzen Sie dafür performance.getEntries() und PerformanceEntry.toJSON().
Veraltete Felder: timing und navigation sind veraltet (Navigation Timing Level 1). Werten Sie stattdessen PerformanceNavigationTiming über getEntriesByType('navigation') aus.
eventCounts wird leer: EventCounts ist ein Map-ähnliches Objekt und wird deshalb als {} serialisiert. Die Werte bekommen Sie mit Object.fromEntries(performance.eventCounts).
Nicht standardisierte Felder wie performance.memory in Chromium sind nicht enthalten.
Kontextabhängig: In Web Workern enthält das Objekt im Wesentlichen nur timeOrigin.
Datenschutz: Zeitstempel sind aus Sicherheitsgründen (Spectre) in ihrer Auflösung reduziert. Beim Senden an Server gelten die üblichen Datenschutzregeln.
Die Methode wird von allen modernen Browsern und von Node.js (perf_hooks, ab Version 16) unterstützt.

Siehe auch

Performance JSON.stringify() MediaDeviceInfo.toJSON() Performance.now() Performance.mark()