-
<script src="script.js"></script>
沒(méi)有 defer 或 async另萤，瀏覽器會(huì)立即加載并執(zhí)行指定的腳本共啃，“立即”指的是在渲染該 script 標(biāo)簽之下的文檔元素之前濒析，也就是說(shuō)不等待后續(xù)載入的文檔元素，讀到就加載并執(zhí)行。 -
<script async src="script.js"></script>
有 async裹唆，加載和渲染后續(xù)文檔元素的過(guò)程將和 script.js 的加載與執(zhí)行并行進(jìn)行（異步）誓斥。 -
<script defer src="myscript.js"></script>
有 defer，加載后續(xù)文檔元素的過(guò)程將和 script.js 的加載并行進(jìn)行（異步）许帐，但是 script.js 的執(zhí)行要在所有元素解析完成之后劳坑，DOMContentLoaded 事件觸發(fā)之前完成。
- 從實(shí)用角度來(lái)講舞吭，首先把所有腳本都放置到 </body> 之前是最佳實(shí)踐泡垃，因?yàn)閷?duì)于舊瀏覽器來(lái)說(shuō)這是唯一的優(yōu)化選擇，此法可保證非腳本的其他一切元素能夠以最快的速度得到加載和解析羡鸥。
Paste_Image.png
藍(lán)色線代表網(wǎng)絡(luò)讀取蔑穴，紅色線代表執(zhí)行時(shí)間，這倆都是針對(duì)腳本的惧浴；綠色線代表 HTML 解析存和。
- 由圖得知：
- defer 和 async 在網(wǎng)絡(luò)讀取（下載）這部分是一樣的衷旅，都是異步的（相較于 HTML 解析）捐腿。
- 兩者的差別在于腳本下載完之后何時(shí)執(zhí)行，顯然 defer 是最接近我們對(duì)于應(yīng)用腳本加載和執(zhí)行的要求的柿顶。
- 關(guān)于 defer茄袖，由圖知它是按照加載順序執(zhí)行腳本的，這一點(diǎn)要善加利用嘁锯。
- async 則是亂序執(zhí)行宪祥，反正對(duì)它來(lái)說(shuō)腳本的加載和執(zhí)行是緊緊挨著的，所以不管你聲明的順序如何家乘，只要它加載完了就會(huì)立刻執(zhí)行蝗羊。
- async 對(duì)于應(yīng)用腳本的用處不大，因?yàn)樗耆豢紤]依賴（哪怕是最低級(jí)的順序執(zhí)行）仁锯，不過(guò)它對(duì)于那些可以不依賴任何腳本或不被任何腳本依賴的腳本來(lái)說(shuō)卻是非常合適的耀找，最典型的例子：Google Analytics。
