《用得上的前端知识》系列 - 你我都很忙,能用100字说清楚,绝不写万字长文
defer和async的区别
- 在不加defer和async的情况下,js的加载和执行都会阻断html的解析。即js文件的加载、执行和html解析是同步进行的。
- defer和async在加载js文件的时候都是异步的,区别在于defer会在html解析完之后再执行js,而async则会在js文件加载完之后立刻执行js脚本。因此async可能会阻断html的解析
应用场景
- 第三方统计代码,因为加了async,如果放在头部(head)加载,就算加载不出来(或者很慢),也不会导致白屏,因为文件的加载是异步的。
- 第三方统计代码,之所以大多数都使用async而不是用defer,且要求放到头部,主要是因为使用了async后,js文件是异步加载的,文件加载过程不会阻断html解析,且在文件加载后立刻执行,在尽可能保证js不阻断html解析的情况下,尽快执行js。以确保某些统计数据的准确性(部分数据,如用户访问次数,js越晚执行,数据误差越大,因为用户可能在js进行统计之前就离开网站了)。