Lighthouse & Web Vitals

# Méthode 1 : Chrome DevTools
# 1. Ouvre ton site dans Chrome
# 2. F12 (DevTools)
# 3. Onglet "Lighthouse"
# 4. Coche les catégories (Performance, Accessibility, SEO, Best Practices)
# 5. Clique "Analyze page"

# Méthode 2 : Ligne de commande (plus fiable)
npx lighthouse https://tonsite.com --output html --output-path rapport.html

# Méthode 3 : PageSpeed Insights (en ligne)
# https://pagespeed.web.dev/

# Les 4 scores Lighthouse
Performance:     90-100 (vert) | 50-89 (orange) | 0-49 (rouge)
Accessibility:   90-100 (vert) | 50-89 (orange) | 0-49 (rouge)
Best Practices:  90-100 (vert) | 50-89 (orange) | 0-49 (rouge)
SEO:             90-100 (vert) | 50-89 (orange) | 0-49 (rouge)

# Objectif minimum pour un site pro :
# Performance >= 90, Accessibility >= 95, SEO >= 95, Best Practices >= 90

# LCP : Largest Contentful Paint
# Bon :     < 2.5 secondes
# Moyen :   2.5 - 4 secondes
# Mauvais : > 4 secondes

# Causes fréquentes d'un mauvais LCP :
# - Images non optimisées (pas de WebP, pas de lazy loading)
# - Fonts qui bloquent le rendu (FOIT)
# - JavaScript qui retarde le rendu
# - Serveur lent (TTFB élevé)

# INP : Interaction to Next Paint
# Bon :     < 200 ms
# Moyen :   200 - 500 ms
# Mauvais : > 500 ms

# Causes fréquentes d'un mauvais INP :
# - JavaScript lourd qui bloque le thread principal
# - Re-renders React excessifs
# - Handlers d'événements lents
#, pas de debounce sur les inputs

# CLS : Cumulative Layout Shift
# Bon :     < 0.1
# Moyen :   0.1 - 0.25
# Mauvais : > 0.25

# Causes fréquentes d'un mauvais CLS :
# - Images sans width/height
# - Fonts qui changent de taille au chargement (FOUT)
# - Contenu injecté dynamiquement au-dessus du fold
# - Pubs ou embeds sans dimension réservée

# Lighthouse CI (dans GitHub Actions)
npx lhci autorun --config=lighthouserc.json

# lighthouserc.json basique :
# {
#   "ci": {
#     "assert": {
#       "preset": "lighthouse:recommended",
#       "assertions": {
#         "categories:performance": ["error", { "minScore": 0.9 }],
#         "categories:accessibility": ["error", { "minScore": 0.95 }]
#       }
#     }
#   }
# }