css与js下载如何阻塞DOM渲染

CSS与JS的下载阻塞DOM解析和渲染理解

       通过script与link引入外部资源，当解析到该标签的时候，会进行下载

（1）css脚本的加载不会阻塞DOM解析过程，会阻塞渲染过程（painting）

（2）js脚本的加载与执行会阻塞DOM解析过程，不会阻塞后续资源的加载

（3）js脚本的加载中，如果你确定不阻塞DOM解析的话，按需给<script>加上defer或者async属，此时脚本下载的过程中是不会阻塞DOM解析的

（4）浏览器遇到<script>且没有defer或async属性的标签时，为了未<script>标签内的js提供最新的信息，会触发页面的回流和重绘过程

（5）如果前面css资源尚未加载完毕时，浏览器会等待它加载完毕之后再执行脚本。即css不阻塞js的加载，但是阻塞它的执行。

所以 ， script标签最好放在底部。link最好放在头部。如果头部同时有script和link的情况下，最好将 script放在 link上面