腳本加載優化
如果我們只是單純在 head 或 body 中引用腳本，由於是否會更改DOM是未知的， 所以腳本在下載執行的過程中會完全阻塞頁面的渲染。
若腳本在 head 或 body 中間，有很大可能會出現空白頁面，也無法進行用戶交互，用戶體驗很差。
即便是可以並行下載 javascript 文件，但這個下載過程中會影響圖片等資源的下載。
所以我們首先需要做的是：
把 script 標簽放在 body 裏最底部；
因為進行 HTTP 請求時有額外的性能開銷，如三次握手，所以還要盡量減少 HTTP 請求：
把 javascript 文件合並成一個；
在一個請求裏加載多個 javascript 文件
但是以上並沒有解決我們的問題，一個大的 javascript 文件會下載執行腳長時間，在這段時間裏，瀏覽器無法做其他事情。這就需要無阻塞腳本，也就是在頁面加載完成後才加載 javascript 代碼，即在 window對象 的 load 事件觸發之後再下載腳本。
1 延遲腳本
defer：首先我們要確定該腳本不會改變DOM，因為加上就是告訴瀏覽器這個腳本不會改變 DOM，可以在頁面加載完成後再執行。 給 script 標簽加上這個屬性後，這個文件就可以跟其他資源並行下載了。IE 從 IE10 開始不支持 defer
async：與 defer 區別在於下載完成後就執行，但 defer 要等到頁面加載完成後才執行
2 動態腳本
也就是動態創建一個 script 標簽，在合適的時機插入到頁面中，我們可以這種方法來根據需要加載文件，也能指定腳本加載順序。
3 XMLHttpRequest腳本註入
就是通過 XHR 獲取腳本 然後在回調函數中創建 script 標簽並插入到頁面中
推薦方法
先添加動態加載所需的腳本，盡可能精簡，其中添加一個加載腳本的函數
在 script 標簽中調用函數加載其他腳本
當然，也有一些懶加載庫能使用。
腳本加載優化