轉載于：https://www.cnblogs.com/chenjg/p/7126822.html

? ? ? ? ? ? ? ? ? ? https://blog.csdn.net/bg70pvnybv1/article/details/78819711

js執行會阻塞DOM樹的解析和渲染、 那么css加載會阻塞DOM樹的解析和渲染嗎？

結論：

1、css加載不會阻塞DOM樹的解析

2、css加載會阻塞DOM樹的渲染

3、css加載會阻塞后面js語句的執行、

因此，為了避免讓用戶看到長時間的白屏時間，我們應該盡可能的提高css加載速度，比如可以使用以下幾種方法:

使用CDN(因為CDN會根據你的網絡狀況，替你挑選最近的一個具有緩存內容的節點為你提供資源，因此可以減少加載時間)

對css進行壓縮(可以用很多打包工具，比如webpack,gulp等，也可以通過開啟gzip壓縮)

合理的使用緩存(設置cache-control,expires,以及E-tag都是不錯的，不過要注意一個問題，就是文件更新后，你要避免緩存而帶來的影響。其中一個解決防范是在文件名字后面加一個版本號)

減少http請求數，將多個css文件合并，或者是干脆直接寫成內聯樣式(內聯樣式的一個缺點就是不能緩存)

注：js是如何阻塞DOM樹的解析和渲染的？

· 如果async為true，那么腳本在下載完成后異步執行。

· 如果async為false，defer為true，那么腳本會在頁面解析完畢之后執行。

· 如果async和defer都為false，那么腳本會在頁面解析中，停止頁面解析，立刻下載并且執行，