Fetchpriority
HTML / CSS 🟡 MidDefinition
Attribut fetchpriority qui indique au navigateur la priorité relative d'une ressource (high, low, auto). Permet d'optimiser le LCP en priorisant l'image hero ou en dépriorisant les ressources secondaires.
Analogie
Comme marquer un colis 'URGENT' à la poste : il passe devant les autres dans la file de traitement.
Exemple de code
<!-- Image LCP prioritaire -->
<img src="hero.jpg" fetchpriority="high" alt="Hero">
<!-- Image carousel non critique -->
<img src="slide3.jpg" fetchpriority="low" alt="Slide">
<!-- Script non critique -->
<script src="analytics.js" fetchpriority="low"></script>
Cas d'usage
Accélérer le LCP en priorisant le chargement de l'image principale au-dessus du fold.