PerformanceObserver

Définition

API qui observe les entrées de la Performance Timeline (paint, navigation, resource, longtask, etc.). Permet de collecter les métriques Web Vitals de manière non-bloquante.

Analogie

Un chronomètre automatique qui enregistre les temps de chaque étape d'une course sans que les coureurs s'arrêtent.

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 liés