HTML <script> async Attribute

The HTML <script> tag

Definition and Usage

async The attribute is a boolean attribute.

If set async The attribute, the script will be downloaded in parallel while parsing the page and will be executed immediately when available. Once the script is completely downloaded, the page parsing will be interrupted, then the script will be executed, and then the parsing of the rest of the page will continue.

Note:async The attribute is only applicable to external scripts (and should only be used when the src attribute exists).

Note:External scripts can be executed in various ways:

  • If async is set: the script will be downloaded in parallel while parsing the page and will be executed immediately when available (before the parsing is completed)
  • If defer is set (but not async): the script will be downloaded in parallel while parsing the page and will be executed after the page parsing is completed
  • If neither async nor defer is set: the script is downloaded and executed immediately, blocking the page parsing until the script execution is complete

Example

The referenced script will be downloaded in parallel while parsing the page and will be executed immediately when available:

<script src="demo_async.js" async></script>

Try it yourself

Syntax

<script async>

Asynchronous Script Execution

The default behavior of the browser when encountering a script element is to pause the processing of the page while loading and executing the script. Each script element is executed synchronously (without attending to anything else during the script loading and execution process) in the order defined.

As the default method for processing scripts, executing them in a synchronous and sequential manner has its significance. However, some scripts do not require such processing, and for these scripts, one can use async Property to improve its performance. A typical example of this is tracking scripts (tracking scripts). These scripts can report the user's website visit records so that advertising companies can customize and deliver advertisements based on user habits, or collect statistics of website visitors for analysis, etc. These scripts are self-contained and generally do not need to interact with elements in the HTML document. There is no point in delaying the display of the page to wait for them to load and then send reports to their own servers.

Used async After the property, the browser will asynchronously load and execute scripts while continuing to parse other elements in HTML (including other script elements). If used properly, this can greatly improve overall loading performance.

Note:Usage async An important consequence of the property is that scripts in the page may no longer execute in the order they were defined. Therefore, if a script uses functions or values defined in other scripts, it is not advisable to use async Property.

Browser Support

The numbers in the table indicate the first browser version to fully support this property.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
8.0 10.0 3.6 5.1 15.0

The HTML <script> tag