css加载是否会阻塞DOM树的解析和渲染?

一分钟了解css加载是否会阻塞DOM树的解析和渲染

 

  1. css加载不会阻塞DOM树的解析;
  2. css会阻塞DOM树的渲染,DOM树解析完此时位于该css之前的js片段可获取到DOM,该css之后的js片段被阻塞;(个人理解:先把DOM树的结构先解析完,等css加载完之后再根据最终的样式来渲染DOM树,避免了css加载完之后DOM树又得重新重绘或者回流等一系列没有必要的损耗)
  3. css加载会阻塞后面js语句的执行
  4. js会阻塞DOM树的解析,也会阻塞DOM树的渲染。

  由于大部分现代浏览器会预加载资源,所以在使用时只要遵循以下原则就可以了:

  1. CSS放在页面头部,保证它先加载完成不会阻塞JS的运行;
  2. JS放在页面底部,保证了兼容性的同时没有让脚本的加载阻塞到HTML的解析,减少了白屏时间。

 

 


 

 

  如有错误,欢迎评论指正、共同提高。[握手]    

  欢迎转载,转载请注明:转载自[ http://www.cnblogs.com/juneling ]

 

posted @ 2020-12-09 21:03  Juine  阅读(1345)  评论(0编辑  收藏  举报