JS阻塞的問題

 

常見問題

 

 http://www.zhihu.com/question/23101413

 

阻塞特性： 
       JS 有個很無語的阻塞特性，就是當瀏覽器在執行JS 代碼時，不能同時作其餘任何事情，不管其代碼是內嵌的仍是外部的。 

 

一、瀏覽器解析html時，是否解析到</html>後，dom樹構造完成，觸發DOMContentLoaded？

　　 答：Dom load事件不一樣的瀏覽器處理方式不一樣，你只須要認爲在這個事件激發之後，整個html dom文檔就是一個可用的狀態，此時documen已經被關閉了，調用document.write會刷白整個頁面。

二、通過測試，ie8+，ff，chrome，opera都是下載完html後，接着並行下載css和多個js，即便將script放在頁面最後</body>以前也是如此，已經再也不是之前說的js一個一個下載。我想問放在頁面最後</body>以前的js，下載期間是否會阻塞頁面渲染（應該不是異步的吧）？

　　答：下載是異步的沒問題，可是每一個javascript執行的時候仍是同步的，就是先出現的script標籤必定是先執行，即便是並行下載它最後一個下載完成。除非標有defer的script標籤，不然任何javascript在執行的時候都會中斷當前html文檔解析，天然會阻止頁面　渲染。

三、瀏覽器並行下載js和異步下載js有什麼性能上的區別？

　　答：其實沒什麼性能上的區別，只是異步下載javascript能夠儘快的讓用戶看到頁面，比較安心罷了。

四、在《高性能javascript》中提到，使用JavaScript動態生成script節點，而後將其插入到文檔中動態加載js，js加載是異步的，加載和執行不會影響頁面渲染！特別不理解，不是說只要執行js就阻塞頁面渲染嗎？

　　答：javascript加載是不會影響已經渲染的頁面，可是會中斷html文檔解析，瀏覽器會在javascript執行之後決定當前文檔是否須要進行從新渲染或者文檔重排。因此即便javascript放到最後面也會使瀏覽器暫停，但不影響以前已經解析出來的dom文檔，此時對於用戶來講是可操做的，而在以前就加載javascript，瀏覽器會提前暫停，給用戶看到的就是白色的頁面，不友好。javascript有可能會修改dom，此時修改dom可能比較危險，由於正處於不穩定的狀態，若是使用document.write甚至會迫使瀏覽器強制解析新出現的動態內容，若是是這種狀況，javascript執行完成之後就會進行重排。若是javascript修改了css，影響了layout的話，也會進行重渲染或重排。

五、作通常的項目有沒有必要使用LABjs，Require.js等加載庫？

　　答：項目大了重構起來很方便的，不必在初期就引入複雜性。