Pourquoi ce LCP est bon ?
Contrairement à la version non optimisée (35 MB), cette page utilise une image de seulement 6 KB. Combinée avec le preload et fetchpriority, elle s'affiche presque instantanément.
❌ Version non optimisée
35 MB
PNG 4000x3000, pas de preload
✅ Version optimisée
6 KB
WebP 1920x1080, preload + fetchpriority
✅ Optimisations appliquées
- Format WebP : Compression supérieure au PNG/JPEG
- Dimensions adaptées : 1920x1080 au lieu de 4000x3000
- Preload :
<link rel="preload" as="image"> - fetchpriority="high" : Priorité maximale de chargement
- width/height : Dimensions explicites pour éviter le CLS
- decoding="async" : Décodage non bloquant
Code utilisé
<!-- Dans le head -->
<link rel="preload" as="image" href="hero.webp" fetchpriority="high">
<!-- Dans le body -->
<img
src="hero.webp"
alt="Hero"
width="1920"
height="1080"
fetchpriority="high"
decoding="async"
/>