网页加载之async与defer

图解外联script加载

如图所示，结论：

1. 普通script的加载与执行是阻塞DOM渲染的，其顺序取决于script标签在文档中的位置，并且会在DOMContentLoaded事件之前执行完毕
2. 标有async的script加载与执行都是异步的，不阻塞DOM渲染，但是无法保证顺序，会在load事件前执行完毕，但无法保证在DOMContentLoaded事件的前或后
3. 标有defer的script加载是异步的，但是执行会在所有DOM渲染之后，在DOMContentLoaded事件之前，顺序取决于script标签在文档中的位置
4. 标有defer的外部script在各个浏览器的表现比较一致，但如果是内联script的情况，只在IE中支持较好，所以尽量避免内联script使用defer

html渲染过程
@import与link
浏览器工作原理

image.png