Reputation: 31688
From what I'm reading, the defer
attribute on <script>
is now widely supported but I never see it used or mentioned.
If you don't need to defer inline scripts and don't add scripts dynamically (which cause problems in IE9- and Safari 4-), it seems that you could use it reliably and have scripts run right before DOMContentLoaded in the specified order (which doesn't happen with async
)
This is basically what most websites need: run a couple or more external scripts in sequence, on DOMready. For example:
<script defer src='jquery.js'></script>
<script defer src='jquery.some-plugin.js'></script>
<script defer src='my-scripts.js'></script>
Why isn't it widely used? Can I actually use it now?
Upvotes: 12
Views: 2173
Reputation: 150563
You ask if:
you could use
defer
reliably and have scripts run right before DOMContentLoaded in the specified order
Unfortunately, I don't see any specs or standards anywhere that say that defer
scripts have to be executed in order, so I don't think you can rely on that in any browser. The specs merely say that defer
scripts have to be executed after the DOM loads.
Upvotes: -1
Reputation: 31688
I did a bit more research and I found that problems with defer
don't stop at inline scripts and scripts added dynamically in IE9. There's a long list of problems and inconsistencies with various browsers on the HTML5 Boilerplate GitHub https://github.com/h5bp/lazyweb-requests/issues/42
It's such a shame, I feel that they should have tried improving on defer
rather than working on the dubious async
(dubious because it's only useful if the scripts don't depend on each other, which is rare for me)
Upvotes: 2