如何利用异步加载优化 JavaScript 资源的执行顺序？

当需要优化JavaScript资源的执行顺序以提升页面加载性能时，异步加载是核心手段，主要通过控制脚本下载与执行的时机来避免阻塞DOM解析，常见方法包括使用async/defer属性、动态创建script标签及合理安排依赖关系。 通常，`<script>`标签默认同步加载，会阻塞HTML解析。使用`async`属性时，脚本下载过程不阻塞解析，下载完成后立即执行，执行顺序不确定，适合独立无依赖的脚本（如统计代码）；`defer`属性则让脚本下载时不阻塞解析，且按引入顺序在DOMContentLoaded事件前执行，适合有顺序依赖的脚本（如库与业务代码）。 动态创建script标签是另一种方式：通过JavaScript在特定时机（如页面交互后）生成`<script>`元素并添加到DOM，可手动控制加载顺序，适合非首屏关键脚本（如广告或第三方插件）。 实际应用中，可根据脚本是否有依赖选择async（无依赖）或defer（有顺序依赖），非关键脚本优先动态加载，同时通过性能工具（如Lighthouse）监控执行顺序，避免因加载混乱导致功能异常。