前几天读到Steve Sounder的一篇文章,他推荐优先使用DEFER
而不是ASYNC
.
主要原因如下:
ASYNC
脚本会阻塞所有在它之后下载完成的同步脚本DEFER
脚本总是会跟ASNYC
脚本同时或是之后执行DEFER
脚本永远不会阻塞同步脚本,然后ASYNC
脚本也许会(依赖于下载ASYNC
脚本有多快)ASYNC
脚本,不妨把它替换为DEFER
,如果你的页面的DOMInteractive时间很长,也许结果会让你意想不到另外一些其它有意思的总结:
ASYNC
脚本不仅会阻塞渲染,而且还会阻塞其它同步脚本的执行ASYNC
脚本一旦下载成功就会立即解析和执行,然而,DEFER
脚本下载成功后并不立即执行,直到HTML解析完成(performance.timing.domInteractive
)ASYNC
脚本的执行顺序不确定,然而DEFER
脚本是按顺执行的(依据在DOM中的顺序)ASYNC
脚本和DEFER
脚本不会阻塞HTML解析,但是他们能阻塞渲染。(这种情况发生在渲染完成前,它们已经被解析和执行并且接管主线程)DEFER
脚本的执行会推迟DOMContentLoad事件触发的,因为它是在DOMInteractive和DOMContentLoaded之间执行的ASYNC
会覆盖DEFER
,所以在大多数的浏览器中同时指定它们二个与只指定ASYNC
是一样的效果