Any way to control Javascript Async Load Order?

泄露秘密 提交于 2019-12-22 04:30:57

问题


How do I set the load and execution order of two external async Javascript files?

Given the following...

<script src="framework.js" async></script> // Larger file
<script src="scripts.js" async></script> // Small file

Though second in order scripts.js is downloading and executing before framework.js due to it's file size, but scripts.js is dependent on framework.js.

Is there a way natively to specify the load and execution order whilst still maintaining async properties?


回答1:


You want to use defer if you want to preserve the execution order. What defer does is it async downloads the script, but defers execution till html parsing is done.

<script src="framework.js" defer></script>
<script src="scripts.js" defer></script>

However, you may want to start creating custom bundles once the number of scripts go higher.

You can see the difference here




回答2:


If you need solution for IE9 (that not support defer attribute), I have created a small loader script:

https://github.com/mudroljub/js-async-loader

In short, it loads all your scripts asynchronously, and then executes them consequently.



来源:https://stackoverflow.com/questions/28893519/any-way-to-control-javascript-async-load-order

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!