I have a couple of questions about the attributes async & defer for the <script> tag which to my understanding only work in HTML5 browsers.
One of my sites has two external JavaScript files that currently sit just above the </body> tag; the first is jquery sourced from google and the second is a local external script.
With respects to site load speed
-
Is there any advantage in adding
asyncto the two scripts I have at the bottom of the page? -
Would there be any advantage in adding the
asyncoption to the two scripts and putting them at the top of the page in the<head>? -
Would this mean they download as the page loads?
-
I assume this would cause delays for HTML4 browsers, but would it speed up page load for HTML5 browsers?
Using <script defer src=...
- Would loading the two scripts inside
<head>with the attributedeferthe same affect as having the scripts before</body>? - Once again I assume this would slow up HTML4 browsers.
Using <script async src=...
If I have two scripts with async enabled
- Would they download at the same time?
- Or one at a time with the rest of the page?
- Does the order of scripts then become a problem? For example one script depends on the other so if one downloads faster, the second one might not execute correctly etc.
Finally am I best to leave things as they are until HTML5 is more commonly used?
