![a311d49af2ecd943a358a2aa6eda9b90.png](https://i-blog.csdnimg.cn/blog_migrate/4e579893576b882109ca54fc0bc5178f.jpeg)
点击右上方,关注开源中国OSC头条号,获取最新技术资讯
本文由云+社区发表
作者:嘿嘿嘿
可能大家都知道,js执行会阻塞DOM树的解析和渲染,那么css加载会阻塞DOM树的解析和渲染吗?接下来,我就来对css加载对DOM树的解析和渲染的影响做一个测试。
为了完成本次测试,先来科普一下,如何利用chrome来设置下载速度
1. 打开chrome控制台(按下F12),可以看到下图,重点在我画红圈的地方
![fc0cab74959b108a0956de6b0c7284f4.png](https://i-blog.csdnimg.cn/blog_migrate/997b3e3b5867e58f8c03589c483ccb36.jpeg)
点击我画红圈的地方(No throttling),会看到下图,我们选择GPRS这个选项
2. 点击我画红圈的地方(No throttling),会看到下图,我们选择GPRS这个选项
![c4f49f5b7a275bd65ac2793c59179775.png](https://i-blog.csdnimg.cn/blog_migrate/81b916ffbf191fdca7310f889381825c.jpeg)
这样,我们对资源的下载速度上限就会被限制成20kb/s,好,那接下来就进入我们的正题
3. 这样,我们对资源的下载速度上限就会被限制成20kb/s,好,那接下来就进入我们的正题
css加载会阻塞DOM树的解析渲染吗?
用代码说话:
css阻塞
这是红色的
假设: css加载会阻塞DOM树