So it turns out one can defer scripts, meaning give the browser a hint that a script will not mess up with the page right now, so it won't affect the rendering and can be delayed for later. This could give you increased performance during the initial page load and rendering, since you're giving the browser a clearance to temporarily skip this script and continue with the other magic it's doing.
The syntax is simple, just add defer
attribute to the script
tag and (to be XHTML compliant, give it a) "defer"
value. Like this:
<script type="text/javascript" defer="defer"> // deferred ... </script> <script type="text/javascript" src="defer.js" defer="defer"> </script>
Believe it or not, the defer attribute, which originated from MS, is now a part of the standard XHTML, as well as HTML4.01 strict and is not supported by FireFox.
I put up a little demo, if you want to see it in action. In my demo, if you check it with FF (all defer
s ignored) you'll get:
With the defers, in IE, you get:
Have in mind that there's not guarantee it will always happen like this. If, for example, an external non-deferred script is taking a while to download, a deferred one might get processed it it's ready. So you cannot rely on this, you can merely instruct the browser: "Hey, dude, this is a low priority, do the rendering first, the best you can..."