async和defer的作用和区别

async和defer是script标签的两个属性,用于在不阻塞页面文档解析的前提下,控制脚本的下载和执行。
作用:

  • async:用于异步下载脚本文件,下载完毕立即解析代码执行
  • defer:用于开启新的线程下载脚本文件,并使用脚本在文档解析完后执行

关于defer我们需要注意下面几点:

  • defer只适用于外联脚本,如果script标签没有指定src属性,只是内联脚本,不要使用defer;
  • 如果有多个声明了defer的脚本,则会按顺序下载和执行 ;
    defer脚本会在DOMContentLoaded和load事件之前执行。

关于async,也需要注意以下几点:

  • 只适用于外联脚本,这一点和defer一致;
  • 如果有多个声明了async的脚本,其下载和执行也是异步的,不能确保彼此的先后顺序;
  • async会在load事件之前执行,但并不能确保与DOMContentLoaded的执行先后顺序 。
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容