PerformanceObserver

Definition

API qui observe les entrees de la Performance Timeline (paint, navigation, resource, longtask, etc.). Permet de collecter les metriques Web Vitals de maniere non-bloquante.

Analogie

Un chronometre automatique qui enregistre les temps de chaque etape d'une course sans que les coureurs s'arretent.

Exemple de code

const observer = new PerformanceObserver((list) => {
  list.getEntries().forEach(entry => {
    console.log(entry.name, entry.duration);
  });
});
observer.observe({ type: 'largest-contentful-paint',
  buffered: true });

Cas d'usage

Mesurer LCP, FID, CLS en production, monitoring RUM (Real User Monitoring).

Termes lies