fetchpriority
Experimental:This is anexperimental technology
Check theBrowser compatibility table carefully before using this in production.
Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.
Thefetchpriority attribute provides a hint to the browser about the relative priority to use when fetching an external resource. This works the same way as thefetchpriority attribute for the HTML<img> and<script> elements.
You can use this attribute with the following SVG elements:
Usage notes
| Value | high |low |auto |
|---|---|
| Default value | auto |
highFetches the external resource at a high priority relative to other external resources.
lowFetches the external resource at a low priority relative to other external resources.
autoDoesn't set a preference for the fetch priority.It is used if no value or an invalid value is set.This is the default.
Examples
This example shows how to set an SVG<script> element priority tohigh.
<svg viewBox="0 0 10 10" height="120px" width="120px" xmlns="http://www.w3.org/2000/svg"> <circle cx="5" cy="5" r="4" /> <script href="./color-change.js" fetchpriority="high"></script></svg>Browser compatibility
svg.elements.feImage.fetchpriority
svg.elements.image.fetchpriority
svg.elements.script.fetchpriority
See also
- SVG
<script>element - HTML
fetchpriorityattribute