HTML / HTML Attributes

HTML Async Attribute

Oct 12, 2022
2 min read
HTML async Attribute

Definition

The async attribute is a boolean that determines whether the script should be fetched asynchronously.

Applicable Elements

The async Attribute can be used with the following elements:

HTML <script> async Attribute

The <script> tag is used to embed a client-side script, such as JavaScript. It can either be embedded directly or through an external file using the src attribute.

The async attribute is a boolean that determines whether the script should be fetched asynchronously. This means it is fetched in parallel to HTML parsing and evaluated as soon as possible.

Syntax

<script async src="https://cdn.ampproject.org/v0.js"></script>

Usage

  • The async attribute is a boolean.
  • The <script> src attribute must be present. The async attribute only applies to external scripts.

There are two different types of scripts:

  • For normal scripts, if the async attribute is present, it will be fetched in parallel to parsing and evaluated as soon as possible.
  • For module scripts, if the async attribute is present, it will fetch the script along with all its dependencies in parallel to parsing and evaluate them as soon as possible.

There are several ways you can execute an external script:

  • If async only, then they are fetched as set out above.
  • If async is not present, but defer is present, then the script is executed after the page has finished parsing. See the defer attribute for more details.
  • If neither async nor defer is present, then the script is fetched and executed immediately before the browser continues parsing the rest of the page.

Values

Values can include:

  • async

Examples

The JavaScript file in the example is set to load asynchronously.

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

The following example loads <script> element with the type=module, and sets a standard fallback script using the nomodule attribute. The nomodule attribute is ignored by any browser that supports modules.

<script async src="script.js"></script>
<script nomodule async src="backupscript.js"></script>

Specification

The async HTML specification for the <script> element is as follows:

Browser Support

The async has the following browser support:

Desktop

ChromeEdgeFirefoxIEOperaSafari
asyncYesYesYesYesYesYes

Mobile

Android WebviewChrome AndroidFirefox AndroidOpera AndroidiOS SafariSamsung Internet
asyncYesYesYesYes