Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
209 views
in Technique[技术] by (71.8m points)

HTML解析中外链的<script> defer async的执行时间是怎样的?

读完红宝书中对这 defer async 描述,我的理解如下:

defer:浏览器立即下载,但延迟执行。关于执行时间,HTML 规定是先于 DOMContentLoaded 执行。但现实中,延迟但不一定顺序执行,也不一定在DOMContentLoaded 前执行

async:异步下载,一定在 load 之前执行,可能在 DOMContentLoaded 之前或之后执行

我的问题有两个:

  1. defer async 外链的 <script> 到底啥时候执行啊。。。
  2. 理解defer async后,<script>写法的最佳实践是怎样的?

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

一、
(1)有 async,加载和渲染后续文档元素的过程将和 script.js 的加载与执行异步
(2)有 defer,加载后续文档元素的过程将和 script.js 的加载异步,但是 script.js 的执行要在所有元素解析完成之后,DOMContentLoaded 事件触发之前完成。

二、按照浏览器的解析顺序,script脚本放在</body>之前执行是最好的,这样就不会出现页面堵塞的情况,确保其他资源得到最快速度的加载和解析,至于怎么使用,我觉得defer和async用处不大,看脚本的性质而定吧


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...