Since October 2024, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.
The fetchPriority property of the HTMLScriptElement interface represents a hint to the browser indicating how it should prioritize fetching an external script relative to other external scripts. It reflects the fetchpriority attribute of the <script> element.
The property allows a developer to signal that fetching a particular script early or late in the loading process has more or less impact on user experience than a browser can reasonably infer when assigning an internal priority. This in turn allows the browser to increase or decrease the priority, and potentially load the script earlier or later than it would otherwise. The property should be used sparingly, as excessive or incorrect prioritization can degrade performance.
The fetch priority allows you to decrease the priority of late-body scripts, or to increase the priority of async scripts without having to use preloading. When early loading of a script is important, the priority can be used to complement preloading, boosting the priority ahead of less-impactful resources that have a higher default priority.
Note that both the internal priority of any fetch operation, and the impact of fetchPriority on the priority, are entirely browser dependent.
A string representing the priority hint. Possible values are:
highFetch the external script at a high priority relative to other external scripts.
lowFetch the external script at a low priority relative to other external scripts.
autoDon't set a preference for the fetch priority. This is the default. It is used if no value is set or if an invalid value is set.
<script id="el" type="module" src="main.js" fetchpriority="high"></script>
const el = document.getElementById("el");
console.log(el.fetchPriority); // Output: "high"
| Specification |
|---|
| HTML> # dom-script-fetchpriority> |
| Desktop | Mobile | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Opera | Safari | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | WebView Android | WebView on iOS | |
fetchPriority |
102101–102 | 102101–102 | 132 | 8887–88 | 17.2 | 102101–102 | 132 | 70 | 17.2 | 19.0 | 102101–102 | 17.2 |
HTMLImageElement.fetchPriorityHTMLLinkElement.fetchPriorityLink header
© 2005–2025 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/HTMLScriptElement/fetchPriority