script async / defer 验证

这个 demo 通过 Worker API 人为控制外链脚本响应延迟,观察 async 与 defer 的执行顺序。

可验证结论
  1. 无属性外链脚本会阻塞 HTML 解析,执行时 document.readyState 仍是 loading。
  2. async 外链脚本下载完就执行,不保证按标签顺序。
  3. defer 外链脚本等 HTML 解析完成后执行,并且按标签顺序执行。
  4. DOMContentLoaded 会在所有 defer 脚本执行完成后触发。
执行日志