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-Interface stellt einen Hinweis für den Browser dar, wie das Abrufen einer bestimmten Ressource im Vergleich zu anderen Ressourcen desselben Typs priorisiert werden sollte. Sie spiegelt das fetchpriority-Attribut des entsprechenden <link>-Elements wider.

Die Eigenschaft ermöglicht es einem Entwickler, darauf hinzuweisen, dass das frühe 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 wenn Ressourcen vorgeladen werden. Dies ermöglicht es dem Browser wiederum, die Priorität zu erhöhen oder zu verringern, und möglicherweise die Ressource früher oder später zu laden, als er es sonst tun würde. Die Eigenschaft sollte sparsam eingesetzt werden, da übermäßige oder falsche Priorisierung die Leistung beeinträchtigen kann.

Die Abrufpriorität kann verwendet werden, um das Preloading zu ergänzen, sodass ein Entwickler die Priorität einer Ressource vor weniger wichtigen Ressourcen erhöhen kann, die standardmäßig mit höherer Priorität vorgeladen werden. Wenn beispielsweise ein bestimmtes Bild wesentlich zum Largest Contentful Paint (LCP) der Website beiträgt, könnte es so eingestellt werden, dass es vorgeladen und mit einer hohen Abrufpriorität versehen wird.

Beachten Sie, dass sowohl die interne Priorität eines Abrufvorgangs als auch die Auswirkung 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 hoher Priorität im Vergleich zu anderen Ressourcen desselben Typs und interner Priorisierung ab.

low

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

auto

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

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

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
fetchPriority

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
See implementation notes.
Uses a non-standard name.
Has more compatibility info.

Siehe auch