js脚本同步、异步与延迟
一般,我们通过src引入js文件时建议在页面末尾引入,因为会阻塞页面的渲染。defer和async可以达到同样效果
当HTML解析器遇到<script>元素时,它必须先执行脚本,然后再恢复文档的解析和渲染。
脚本的执行旨在默认情况下时同步和阻塞的,我们可以为script标签添加defer和async属性(当然并不是所有浏览器支持)
使用defer和async属性,浏览器可以在下载脚本时继续解析和渲染文档
如果标签同时有这两个属性,同时支持defer和async属性时会自动忽略defer属性
如下:
<script defer src="aa.js"></script> <script async src="bb.js"></script>
注意:
延迟的脚本会按它们在文档中出现的顺序执行,而异步的脚本在它们载入后执行(顺序可能无序)。