一分钟了解css加载是否会阻塞DOM树的解析和渲染
- css加载不会阻塞DOM树的解析;
- css会阻塞DOM树的渲染,DOM树解析完此时位于该css之前的js片段可获取到DOM,该css之后的js片段被阻塞;(个人理解:先把DOM树的结构先解析完,等css加载完之后再根据最终的样式来渲染DOM树,避免了css加载完之后DOM树又得重新重绘或者回流等一系列没有必要的损耗)
- css加载会阻塞后面js语句的执行
- js会阻塞DOM树的解析,也会阻塞DOM树的渲染。
由于大部分现代浏览器会预加载资源,所以在使用时只要遵循以下原则就可以了:
- CSS放在页面头部,保证它先加载完成不会阻塞JS的运行;
- JS放在页面底部,保证了兼容性的同时没有让脚本的加载阻塞到HTML的解析,减少了白屏时间。
如有错误,欢迎评论指正、共同提高。[握手]
欢迎转载,转载请注明:转载自[ http://www.cnblogs.com/juneling ]