Home

Running scripts in WebKit (async/defer)


Running scripts in WebKit (async/defer)

Wowowow. Safari gets defer on scripts (something that landed in Internet Explorer 4), but also adds async—which does not guarantee the order of the script execution. They have also implemented an onload attribute for <script> tags which will run your init function once a given script is ready for use.

Both async and defer scripts begin to download immediately without pausing the parser and both support an optional onload handler to address the common need to perform initialization which depends on the script. The difference between async and defer centers around when the script is executed. Each async script executes at the first opportunity after it is finished downloading and before the window’s load event. This means it’s possible (and likely) that async scripts are not executed in the order in which they occur in the page. The defer scripts, on the other hand, are guaranteed to be executed in the order they occur in the page. That execution starts after parsing is completely finished, but before the document’s DOMContentLoaded event.

Prior (and now, actually) loading scripts in parallel has been somewhat of a mess depending on the number of scripts you need to load. Check it out!