HTML-Attribut: fetchpriority
Das fetchpriority-Attribut ermöglicht es einem Entwickler zu signalisieren, dass das frühzeitige Laden eines bestimmten Bildes mehr oder weniger Einfluss auf die Benutzererfahrung hat, als ein Browser beim Zuweisen einer internen Priorität vernünftigerweise annehmen kann. Dies wiederum erlaubt es dem Browser, die Priorität zu erhöhen oder zu verringern und das Bild möglicherweise früher oder später zu laden, als es sonst der Fall wäre.
Dieses Attribut kann auf <img>, <link> und <script> Elemente angewendet werden. Es hat auch ein SVG-Gegenstück.
Die Ladepriorität kann verwendet werden, um das Preloading zu ergänzen, sodass ein Entwickler die Priorität über weniger einflussreiche Ressourcen mit höherer Standardpriorität hinaus erhöhen kann. Wenn beispielsweise ein Entwickler weiß, dass ein bestimmtes Bild erheblich zum Largest Contentful Paint (LCP) der Website beiträgt, könnte er für das Bild <link rel="preload"> hinzufügen und dann die Priorität weiter mit dem fetchpriority-Attribut erhöhen.
Beachten Sie, dass sowohl die interne Priorität eines jeden Ladevorgangs als auch der Einfluss von fetchpriority auf die Priorität vollständig browserabhängig sind.
Dieses Attribut ist enumeriert und kann einen der folgenden Werte annehmen:
high-
Lädt die externe Ressource mit hoher Priorität im Vergleich zu anderen externen Ressourcen.
low-
Lädt die externe Ressource mit niedriger Priorität im Vergleich zu anderen externen Ressourcen.
auto-
Setzt keine Präferenz für die Ladepriorität. Es wird verwendet, wenn kein Wert oder ein ungültiger Wert gesetzt ist. Dies ist der Standardwert.
Verwendungshinweise
Das Attribut sollte sparsam verwendet werden, da übermäßige oder falsche Priorisierung die Leistung beeinträchtigen kann.
Spezifikationen
| Specification |
|---|
| HTML> # attr-img-fetchpriority> |
| HTML> # attr-link-fetchpriority> |
| HTML> # attr-script-fetchpriority> |
Browser-Kompatibilität
>html.elements.img.fetchpriority
html.elements.link.fetchpriority
html.elements.script.fetchpriority
Siehe auch
- SVG
fetchpriorityAttribut