异步加载 js

async 属性（仅适用于外部脚本）

• 对于普通脚本，如果存在 async 属性，那么普通脚本会被并行请求，并尽快解析和执行
• 对于模块脚本，如果存在 async 属性，那么脚本及其所有依赖都会在延缓队列中执行，因此它们会被并行请求，并尽快解析和执行。

该属性的脚本不会按照页面中的顺序来执行，而是谁先加载完成谁执行。意思就是，带有该属性的脚本会并行加载，并且加载完成后就执行，执行的时候会暂停页面渲染

示例

<script src="xxx.js" async></script>

defer 属性

在文档解析完成后执行（在触发 DOMContentLoaded 事件前执行）。因为有 defer 属性的脚本会阻止 DOMContentLoaded 事件，直到脚本被加载且完成解析

type="module"

带有该属性的脚本将被视为 js 模块，不受 async 和 defer 属性的影响