https://www.cnblogs.com/chenjg/p/7126822.html
http://www.reibang.com/p/e141d1543143
想了解詳情的話可以看看上面兩篇文章,由上所述,可以得出以下結(jié)論:
css加載不會阻塞DOM樹的解析
css加載會阻塞DOM樹的渲染
css加載會阻塞后面js語句的執(zhí)行、不會影響加載
原因:可能會有 var width = $('#id').width()缺脉,這意味著,js代碼執(zhí)行前妻献,瀏覽器必須保證css文件已下載和解析完成糯耍。這也是css阻塞后續(xù)js的根本原因。
辦法:當js文件不需要依賴css文件時喂急,可以將js文件放在頭部css的前面格嘁。
css 很大,就會加載不出來廊移,因此讥蔽,為了避免讓用戶看到長時間的白屏時間,我們應(yīng)該盡可能的提高css加載速度画机,比如可以使用以下幾種方法:
1.使用CDN(因為CDN會根據(jù)你的網(wǎng)絡(luò)狀況,替你挑選最近的一個具有緩存內(nèi)容的節(jié)點為你提供資源新症,因此可以減少加載時間)
2.對css進行壓縮(可以用很多打包工具步氏,比如webpack,gulp等,也可以通過開啟gzip壓縮)
3.合理的使用緩存(設(shè)置cache-control,expires,以及E-tag都是不錯的徒爹,不過要注意一個問題荚醒,就是文件更新后芋类,你要避免緩存而帶來的影響。其中一個解決防范是在文件名字后面加一個版本號或者時間)
4.減少http請求數(shù)界阁,將多個css文件合并侯繁,或者是干脆直接寫成內(nèi)聯(lián)樣式(內(nèi)聯(lián)樣式的一個缺點就是不能緩存)