script 標(biāo)簽 async 屬性

普通script

文檔解析的過程中，如果遇到script腳本，就會(huì)停止頁面的解析進(jìn)行下載（但是Chrome會(huì)做一個(gè)優(yōu)化，如果遇到script腳本，會(huì)快速的查看后邊有沒有需要下載其他資源的，如果有的話，會(huì)先下載那些資源，然后再進(jìn)行下載script所對(duì)應(yīng)的資源，這樣能夠節(jié)省一部分下載的時(shí)間 @Update: 2018-08-17）。
資源的下載是在解析過程中進(jìn)行的，雖說script1腳本會(huì)很快的加載完畢，但是他前邊的script2并沒有加載&執(zhí)行，所以他只能處于一個(gè)掛起的狀態(tài)，等待script2執(zhí)行完畢后再執(zhí)行。
當(dāng)這兩個(gè)腳本都執(zhí)行完畢后，才會(huì)繼續(xù)解析頁面。

defer 屬性

文檔解析時(shí)，遇到設(shè)置了defer的腳本，就會(huì)在后臺(tái)進(jìn)行下載，但是并不會(huì)阻止文檔的渲染，當(dāng)頁面解析&渲染完畢后。
會(huì)等到所有的defer腳本加載完畢并按照順序執(zhí)行，執(zhí)行完畢后會(huì)觸發(fā)DOMContentLoaded事件。

async

async腳本會(huì)在加載完畢后執(zhí)行。
async腳本的加載不計(jì)入DOMContentLoaded事件統(tǒng)計(jì)，也就是說下圖兩種情況都是有可能發(fā)生的

推薦的應(yīng)用場(chǎng)景

defer

如果你的腳本代碼依賴于頁面中的DOM元素（文檔是否解析完畢），或者被其他腳本文件依賴。

async

如果你的腳本并不關(guān)心頁面中的DOM元素（文檔是否解析完畢），并且也不會(huì)產(chǎn)生其他腳本需要的數(shù)據(jù)。

如果不太能確定的話，用defer總是會(huì)比async穩(wěn)定。