Javascript Async=true Attribute

Question

I see this code sample in a certain unnamed vendor's documentation. It appears to load a script asynchronously, then invoke a function from it thereafter. I realize that the if-undefined check will prevent an overt error, but is this not totally incorrect?

I believe that in IE8/9 it will work properly but block execution until the LOADER_URL script loads and executes; and I believe in many other browsers that do support the async attrbute, this will simply result in the inline-block executing the code inside the if-block only part of the time. The documentation states "tags are asynchronous and do not slow the loading of your pages."

<script type="text/javascript" src="LOADER_URL" async="true"></script>
<script type="text/javascript">
if (typeof (OBJECT_DEFINED_IN_LOADER_URL) != "undefined") { OBJECT_DEFINED_IN_LOADER_URL.Load(false); }
</script>

Looking at an earlier version of their documentation, it did not have the suggestion of the async attribute and did not make this claim. Did some technical writer make a mistake and say "yeah, that'll work" without testing adequately in all browsers? In IE <= 9 it will work all the time. And since async code is uber-fun to debug ... maybe it worked for them ...

That's my suspicion :)

Answer 1

You were correct to be suspicious. The posted code is pretty much guaranteed to not work as intended in browsers supporting the async attribute.

Basically there are 3 "modes":

1. If the async attribute is present, then the script will be executed asynchronously, as soon as it is available.
2. If the async attribute is not present but the defer attribute is present, then the script is executed when the page has finished parsing.
3. If neither attribute is present, then the script is fetched and executed immediately, before the user agent continues parsing the page.

Source: http://www.w3.org/html/wg/drafts/html/master/scripting-1.html

Note: The async attribute value is ignored, the mere presence of the attribute indicates that the script should be executed asynchronously. So setting the value to false will still be the same as setting it to true.