Lighthouse建议移除未使用JS，使用setTimeout延迟加载是否可行？

无法弃用但存在大量未使用代码的JS库处理方案 #

• 优先做按需导入与Tree Shaking：若第三方库支持ES模块规范，通过import { xx } from 'library'的方式仅引入实际用到的功能模块，打包阶段摇树会直接剔除未使用代码，从根源减少JS体积，是最优解。
• 异步加载全量包：如果库不支持按需导入，给script标签添加async或defer属性异步加载资源，不阻塞页面首屏渲染主线程，也不会推迟资源加载时机。
• 利用浏览器空闲时间执行：若确实需要延后执行逻辑，用requestIdleCallback替代硬定时，仅在浏览器无高优先级任务时执行JS，避免抢占用户交互所需的线程资源。

setTimeout延迟加载方案的合理性评估 #

该方案属于临时可用但非最优的解决方案：

• 优势是确实可以绕开Lighthouse的未使用JS检测规则，提升实验室评分，符合你需要自动加载、不能依赖用户事件触发的场景要求。
• 缺陷是setTimeout的定时逻辑是固定的，若用户在定时结束前就产生交互操作，JS执行会抢占主线程资源，直接导致交互卡顿，反而损伤实际用户体验。

Google性能统计逻辑说明与性能隐患分析 #

你对Google性能统计逻辑的理解完全正确：

• Google用于搜索排名权重的Core Web Vitals指标采集的是真实用户全流程访问的性能数据（RUM数据），而非Lighthouse的实验室模拟数据。即便延迟10秒加载能通过Lighthouse检测，也不代表真实用户场景下的性能达标。
• 该方案依然存在明确的性能隐患：你并未真正移除未使用的代码，用户最终还是要下载全量JS包，会额外消耗用户流量；若延迟加载的JS执行时机刚好和用户操作重合，会拉低INP（交互到下一步绘制）指标，依然会影响搜索排名权重。

内容的提问来源于stack exchange，提问作者Rabin Poudyal