defer脚本在DOM构建完成、DOMContentLoaded触发前按序执行，适合依赖DOM或有脚本依赖的场景；async脚本下载完立即执行、顺序不可控，仅适用于完全独立、无DOM操作的脚本。

DOM树加载完成时，defer 和 async 都能让脚本不阻塞HTML解析，但它们的执行时机和适用场景完全不同——选错会导致脚本执行顺序错乱或依赖未就绪。

defer：等DOM构建完再按顺序执行

defer 适用于有依赖关系、需操作DOM的脚本（比如初始化页面组件）。它让浏览器并行下载脚本，但推迟执行，直到整个HTML解析完毕、DOM树构建完成（即触发 DOMContentLoaded 事件前）。

• 多个 defer 脚本保持书写顺序执行，适合模块化、有先后依赖的代码
• 只对外部脚本生效（<script src="..." defer></script>），内联脚本加 defer 会被忽略
• 即使脚本下载慢，也不会延迟DOM构建，但会延迟 DOMContentLoaded 的触发（直到所有 defer 脚本执行完）

async：下载完立刻执行，不保证顺序

async 适用于完全独立、无依赖、也不操作DOM的脚本（比如统计埋点、广告SDK）。它让脚本异步下载，一旦下载完成就立即执行，不管DOM是否就绪、其他脚本是否加载。

Alibabacloud Sdk Client Initialization For Java

在 Java 中初始化和管理阿里云 SDK客户端。包括单例模式、线程安全、endpoint 与 region 配置、VPC 终端节点、同步与异步等。

下载

• 多个 async 脚本执行顺序不确定，谁先下完谁先执行
• 可能在DOM还没解析完时就执行，此时 document.getElementById 等操作大概率失败
• 不影响 DOMContentLoaded 触发时间，因为它不参与DOM就绪的等待队列

什么时候该用哪个？看脚本是否“等得起”

判断依据不是“要不要快”，而是“能不能晚执行”。

立即学习“Java免费学习笔记（深入）”；

• 需要读写DOM、依赖其他JS模块（如Vue/React初始化）、或必须在DOM就绪后运行 → 用 defer
• 纯计算逻辑、第三方分析脚本、资源预加载工具 → 用 async
• 内联脚本（<script>...</script>）无法使用这两个属性，若需延迟执行，应手动包裹在 DOMContentLoaded 监听器中

和 DOMContentLoaded 的关系要理清

defer 脚本执行时机 ≈ DOMContentLoaded 触发前；async 脚本可能在它之前或之后执行，完全不可控。

• 想确保脚本一定在DOM就绪后运行，且不想手动写事件监听 → defer 是最简方案
• 如果用了 async 又需要操作DOM，必须自己加保护逻辑，例如：if (document.body) { /* 执行 */ } else { document.addEventListener('DOMContentLoaded', ...) }
• 现代开发中，打包工具常自动为入口文件添加 defer，但第三方SDK通常推荐 async（官方文档会明确说明）