HTMLLinkElement: fetchPriority-Eigenschaft

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.

Die fetchPriority-Eigenschaft des HTMLLinkElement-Interfaces stellt einen Hinweis für den Browser dar, wie er das Abrufen einer bestimmten Ressource im Vergleich zu anderen Ressourcen desselben Typs priorisieren soll. Sie spiegelt das fetchpriority-Attribut des entsprechenden <link>-Elements wider.

Die Eigenschaft ermöglicht es einem Entwickler, zu signalisieren, dass das frühzeitige Abrufen einer bestimmten Ressource im Ladeprozess mehr oder weniger Einfluss auf die Benutzererfahrung hat, als ein Browser vernünftigerweise ableiten kann, wenn er eine interne Priorität zuweist, insbesondere beim Vorladen von Ressourcen. Dies erlaubt es dem Browser wiederum, die Priorität zu erhöhen oder zu verringern und die Ressource möglicherweise früher oder später zu laden, als er es sonst tun würde. Die Eigenschaft sollte sparsam verwendet werden, da eine übermäßige oder falsche Priorisierung die Leistung verschlechtern kann.

Die Abrufpriorität kann verwendet werden, um das Vorladen zu ergänzen und einem Entwickler zu ermöglichen, die Priorität einer Ressource gegenüber weniger einflussreichen Ressourcen zu erhöhen, die standardmäßig mit einer höheren Priorität vorab geladen werden. Zum Beispiel, wenn ein bestimmtes Bild signifikant zum Largest Contentful Paint (LCP) der Website beiträgt, könnte es so eingestellt werden, dass es vorab geladen wird und mit einer hohen Abrufpriorität.

Beachten Sie, dass sowohl die interne Priorität jeder Abrufoperation als auch der Einfluss von fetchPriority auf die Priorität vollständig vom Browser abhängig sind.

Wert

Ein String, der den Prioritätshinweis darstellt. Mögliche Werte sind:

high

Ruft die Ressource mit einer hohen Priorität im Vergleich zu anderen Ressourcen desselben Typs und interner Priorität ab.

low

Ruft die Ressource mit einer niedrigen Priorität im Vergleich zu anderen Ressourcen desselben Typs und interner Priorität ab.

auto

Keine Präferenz für die Abrufpriorität setzen. Dies ist der Standardwert. Er wird verwendet, wenn kein Wert gesetzt ist oder ein ungültiger Wert gesetzt wird.

Beispiele

js
const preloadLink = document.createElement("link");
preloadLink.href = "my-image.jpg";
preloadLink.rel = "preload";
preloadLink.as = "image";
preloadLink.fetchPriority = "high";
document.head.appendChild(preloadLink);

Spezifikationen

Specification
HTML
# dom-link-fetchpriority

Browser-Kompatibilität

Siehe auch