HTMLLinkElement: fetchPriority-Eigenschaft

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.

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