轉(zhuǎn)載于：https://www.cnblogs.com/chenjg/p/7126822.html

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

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

結(jié)論：

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

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

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

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

使用CDN(因為CDN會根據(jù)你的網(wǎng)絡(luò)狀況，替你挑選最近的一個具有緩存內(nèi)容的節(jié)點為你提供資源，因此可以減少加載時間)

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

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

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

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

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

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

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