HTML defer Attribute
Description
The defer attribute is a boolean attribute used in <script> tags within HTML documents. When present, it specifies that the script is meant to be executed after the document has been parsed, but before firing the DOMContentLoaded event. This is particularly useful for scripts that don't need to be run immediately and can wait until the HTML is fully parsed, thus improving the loading time of the page by not blocking the rendering of the document.
Scripts with the defer attribute will maintain their execution order as they appear in the document. This means that if multiple scripts are marked with defer, they will execute in the order they are encountered in the document, ensuring any dependencies between scripts are respected. Unlike the async attribute, which also doesn't block the document's parsing but does not guarantee the order of execution, defer provides a way to keep scripts that depend on each other in the correct sequence.
The defer attribute is ignored if the <script> tag does not have a src attribute (i.e., if the script is inline). It is supported by all modern browsers and is a recommended practice for scripts that are not required to interact with the initial loading of the page. Using defer helps in optimizing the performance of web pages, making them more responsive and quicker to interact with.
Syntax
<script defer>Values
The defer attribute is a boolean attribute, therefore no values are associated with this attribute.
Applies To
The defer attribute can be used on the following html elements.
Example
<script src="myScript.js" defer></script>Browser Support
The following table will show you the current browser support for the HTML defer Attribute.
| Desktop | |||||
 |
 |
 |
 |
 |
|
| 12 | 1 | 3.5 | 15 | 3 | |
| Tablets / Mobile | |||||
|
|
|
|
 |
 |
| 18 | 4 | 14 | 2 | 1 | 4.4 |
Last updated by CSSPortal on: 28th March 2024