Using the async attribute

by: John Surdakowski06/11/2012

Quick Summary The async tag is a boolean attribute, which means that its presence alone in the browser indicates true, or “Yes, use this damn feature!” It tells the browser to execute (in this case) script.min.js as soon as it is available. Scripts that are loaded using async are executed as soon as they are downloaded, rather than in the order of their appearance in the HTML.


Why, you should be using the async attribute.

When browsers download JavaScript, they do so one script as a time, allowing the browser to parse and pre-run optimizations.

The async tag is a boolean attribute, which means that its presence alone in the browser indicates true, or “Yes, use this damn feature!” It tells the browser to execute (in this case) script.min.js as soon as it is available. Scripts that are loaded using async are executed as soon as they are downloaded, rather than in the order of their appearance in the HTML.

Besides minifying your scripts, or using CDNs, you should at least be using async to deliver scripts to your user as soon as they are ready.

Note: The async attribute is supported in all major browsers, except Internet Explorer. (shocker)

One issue that I have yet to solve, is to async the js files that WordPress plugins inject into your website. If anyone has a solution for this, I’d love to hear it.

Thanks!


John

Let's discuss your ecommerce goals

Schedule a consultation call with one of our experts.

CONTACT US
Let's discuss your ecommerce goals