DomContentLoaded、load 以及 script脚本的async、defer

1. 先来了解一下什么是DOMContentLoaded和load

原文描述-简书 

有兴趣看原文，这里不加赘述。简单来说DOMContentloaded是页面中的DOM元素解析完成时，而load是内嵌资源加载完成时触发

2. defer 和 async

浅谈async和defer   DomContentLoaded详解

当在script标签上什么都不加是，解析和脚本加载会同步进行

而使用defer后，会异步的解析，脚本会在Dom解析完成，DomContentloaded触发前执行

使用async后，同样会异步解析，但是脚本的执行不会影响DOMContentLoaded的触发

3. 总结

如果你的脚本需要依赖Dom元素（文档是否渲染完毕）， 或者被其他脚本文件依赖，推荐使用defer

如果你的脚本并不关心Dom元素，并且he其他脚本没有依赖关系，那么推荐使用async