HTMLLinkElement : propriété fetchPriority
Baseline
2024
Newly available
Since October 2024, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.
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
Loading…
Voir aussi
- La propriété
HTMLImageElement.fetchPriority - La propriété
HTMLScriptElement.fetchPriority - L'en-tête HTTP
Link - Optimiser le chargement des ressources avec l'API Fetch Priority (angl.) pour des informations sur la façon dont cette API affecte les priorités dans Chrome.