HTMLLinkElement : propriété fetchPriority
Baseline
2024
Newly available
Depuis October 2024, cette fonctionnalité fonctionne sur les appareils et les versions de navigateur les plus récents. Elle peut ne pas fonctionner sur les appareils ou navigateurs plus anciens.
La propriété fetchPriority de l'interface HTMLLinkElement représente une indication pour le navigateur sur la façon de prioriser la récupération d'une ressource particulière par rapport à d'autres ressources du même type.
Elle reflète l'attribut fetchpriority de l'élément HTML <link> correspondant.
La propriété permet à un·e développeur·euse d'indiquer que la récupération d'une ressource particulière tôt dans le processus de chargement a plus ou moins d'impact sur l'expérience utilisateur·ice que ce que le navigateur peut raisonnablement déduire lors de l'attribution d'une priorité interne, en particulier lors du préchargement de ressources. Ceci permet au navigateur d'augmenter ou de diminuer la priorité, et potentiellement de charger la ressource plus tôt ou plus tard qu'il ne l'aurait fait autrement. La propriété doit être utilisée avec parcimonie, car une priorisation excessive ou incorrecte peut dégrader les performances.
La priorité de récupération peut être utilisée pour compléter le préchargement, permettant à un·e développeur·euse d'augmenter la priorité d'une ressource par rapport à d'autres ressources moins importantes qui sont par défaut préchargées avec une priorité plus élevée. Par exemple, si une image particulière contribue de manière significative au Rendu du contenu le plus volumineux (LCP) du site web, elle peut être préchargée et avoir une priorité de récupération élevée.
Notez que la priorité interne de toute opération de récupération, ainsi que l'impact de fetchPriority sur cette priorité, dépendent entièrement du navigateur.
Valeur
Une chaîne de caractères représentant l'indication de priorité. Les valeurs possibles sont :
high-
Récupère la ressource avec une priorité élevée par rapport aux autres ressources du même type et à la priorisation interne.
low-
Récupère la ressource avec une priorité faible par rapport aux autres ressources du même type et à la priorisation interne.
auto-
Ne définit aucune préférence pour la priorité de récupération. Il s'agit de la valeur par défaut. Elle est utilisée si aucune valeur n'est définie ou si une valeur invalide est définie.
Exemples
const preloadLink = document.createElement("link");
preloadLink.href = "mon-image.jpg";
preloadLink.rel = "preload";
preloadLink.as = "image";
preloadLink.fetchPriority = "high";
document.head.appendChild(preloadLink);
Spécifications
| Specification |
|---|
| HTML # dom-link-fetchpriority |
Compatibilité des navigateurs
Chargement…