Async JavaScript

Reintroducing the <script> Tag

At the risk of sounding hyperbolic, <script> is the most important HTML tag of all time. Don’t believe me? Consider that a page consisting entirely of a single script tag can do anything. It can spin itself a document from whole cloth, loading whatever resources it wants. By contrast, even the most marvelous page without a <script> tag is sharply limited, unable to respond to the user’s actions with anything more complicated than a CSS transition.

In modern browsers, <script> comes in two refreshing flavors: classic and nonblocking. In this section, we’ll see how you can use both varieties to make your pages load as quickly as possible.

Where the Blocking Scripts Go

A standard-issue <script> tag is commonly ...