Core Web Vitals (LCP, INP, CLS)

Definition

Trois métriques Google mesurant l'expérience utilisateur : LCP (temps d'affichage du plus grand élément), INP (réactivité aux interactions), CLS (stabilité visuelle).

Analogie

Les 3 notes d'un restaurant : rapidité du service (LCP), réactivité du serveur (INP), stabilité de la table (CLS).

Exemple de code

// Measure with web-vitals library
import { onLCP, onINP, onCLS } from 'web-vitals';
onLCP(({ value }) => analytics.send('LCP', value));
onINP(({ value }) => analytics.send('INP', value));
onCLS(({ value }) => analytics.send('CLS', value));
// Good: LCP<2.5s, INP<200ms, CLS<0.1

Cas d'usage

Monitorer et optimiser l'UX mesurable pour améliorer le SEO et la satisfaction utilisateur.

Anti-pattern

Termes lies