本文目录一览：
- 1、css和js的加载/执行是否会阻塞Dom
- 2、哪些地方会出现css阻塞，哪些地方会出现js阻塞
- 3、CSS 动画会不会被 JS 阻塞
- 4、css会不会影响js事件执行 求大神解答
- 5、如何跳过长时间无法加载的 JS 或 CSS 文件
css和js的加载/执行是否会阻塞Dom
1.都没有配置：立即执行，阻塞DOM的解析
2.srcript async /: Dom加载和渲染后续文档与js的加载和执行异步关系
3.srcript defer /: Dom加载和渲染后续文档与js的加载异步关系， js的加载要在dom解析之前完成(DOMContentLoaded)
所以js不同情况下会阻塞Dom的解析和渲染，需要放置尾部；
页面渲染需要css解析生成的cssom再和dom生成renderTree,才能交给渲染引擎进行计算渲染
哪些地方会出现css阻塞，哪些地方会出现js阻塞
默认情况下，CSS会被看做是渲染阻塞资源，也就是说，浏览器在CSSOM建立前，已经处理过的网页内容不会被显示到页面上。所以，保证你的CSS代码能够快速从服务器获取且尽可能的简短，并注意使用媒体类型（media types）和媒体查询（media queries）去进行非阻塞的渲染。
CSS 动画会不会被 JS 阻塞
不会，两者执行的不一样，你可以百度一下浏览器渲染过程就知道页面是怎么在浏览器中加载渲染实现的。
css会不会影响js事件执行 求大神解答
看你用的是什么了，一般情况下是不会影响的，在js里面定义css有可能是会影响的！
如何跳过长时间无法加载的 JS 或 CSS 文件
解决方式：在script标签上使用async=“async”属性标记
解决思路：周所周知，script标签默认是阻塞式加载，这意味着如果某个script标签加载缓慢时，下面的script就无法执行，页面的解析会被阻塞。这是有原因的，因为浏览器无从得知这个script是否会输出html片段或者改变页面的一些样式等等，所以浏览器才会选择阻塞等待。但某些时候，我们是可以确定某个js是不会改变页面本身的，因此我们也不希望这个js阻塞页面的加载。此时我们就可以使用html5中的新属性 — async
script src=”” async=”async”/script
script src=””/script
这时候，b.js就不会等待a.js加载完成。页面也不会被a.js所阻塞。
原创文章，作者：小蓝，如若转载，请注明出处：https://www.506064.com/n/244386.html
微信扫一扫 
支付宝扫一扫 