读完红宝书中对这 defer async 描述,我的理解如下:
defer:浏览器立即下载,但延迟执行。关于执行时间,HTML 规定是先于 DOMContentLoaded 执行。但现实中,延迟但不一定顺序执行,也不一定在DOMContentLoaded 前执行
async:异步下载,一定在 load 之前执行,可能在 DOMContentLoaded 之前或之后执行
我的问题有两个:
- defer async 外链的 <script> 到底啥时候执行啊。。。
- 理解defer async后,<script>写法的最佳实践是怎样的?
一、
(1)有 async,加载和渲染后续文档元素的过程将和 script.js 的加载与执行异步
(2)有 defer,加载后续文档元素的过程将和 script.js 的加载异步,但是 script.js 的执行要在所有元素解析完成之后,DOMContentLoaded 事件触发之前完成。
二、按照浏览器的解析顺序,script脚本放在</body>之前执行是最好的,这样就不会出现页面堵塞的情况,确保其他资源得到最快速度的加载和解析,至于怎么使用,我觉得defer和async用处不大,看脚本的性质而定吧