[HTML] script 資源載入,async、defer 與 integrity

HTML5 在 <script> 標籤中新增了幾個幫助載入外部 js 資源的屬性。 首先,先來看一下 DomContentLoaded 與 load 事件 網頁正常載入的順序: 解析 HTML 結構 載入解析外部 stylesheet 或 js 資源。 執行載入的 script (注意:此時會暫停 HTML 的繪製) HTML dom 載入完成 ( DomContentLoaded,JQuery 的 ready ) 載入剩餘的 stylesheet 與圖片或 frame 全部資源與頁面載入完畢 ( load ) 從以上流程我們也可以發現,為什麼有人常說若是需要等 dom 載入完成才能執行的 <script> 標籤,放在body 底下可以增進網頁的載入速度。 有了初步流程的認識,接下來說說 HTML5 在 <script> 幾個新增的屬性~ async 在背景下載 script(不暫停 […]

Continue reading