动态导入耗时需测量从调用import()到promise resolve的全链路时间，包含网络、解析、编译、执行等环节；推荐用performance.now()手动打点，避免console.time和date.now()，并注意缓存、polyfill及监控集成。
动态导入（import()）的耗时评估，关键在于捕获从调用 import() 到模块加载完成（即 Promise resolve）的完整时间。它不等于网络请求时间，而是包含 DNS、TCP、TLS、HTTP 下载、解析、编译、执行等全链路耗时，需在 JS 层精准打点。
手动打点：最直接可控的方式
在 import() 调用前后记录时间戳，是最轻量、无依赖的方法：
- 调用前用
performance.now()记录起始时间（避免Date.now()的毫秒精度不足） - Promise resolve 后立即记录结束时间，相减即为总耗时
- 建议包裹成可复用函数，并带上模块路径用于归类分析
示例：
function trackImport(modulePath) {
const start = performance.now();
return import(modulePath)
.then(module => {
const duration = performance.now() - start;
// 上报：modulePath, duration, status: 'success'
console.log(`✅ ${modulePath} loaded in ${duration.toFixed(2)}ms`);
return module;
})
.catch(err => {
const duration = performance.now() - start;
// 上报：modulePath, duration, status: 'error', error: err.name
console.error(`❌ ${modulePath} failed after ${duration.toFixed(2)}ms`, err);
throw err;
});
}
<p>// 使用
trackImport('./charts/LineChart.js').then(m => m.render());</p>利用 PerformanceObserver 监听资源加载（进阶）
对于更细粒度的分析（如区分网络 vs 编译耗时），可结合 PerformanceObserver 监听 resource 和 navigation 类型条目：
- 动态
import()触发的 JS 资源会生成resource条目，其name是模块 URL，duration是从 fetch 开始到加载完成的时间 - 注意：该
duration不含模块执行（eval）时间，而手动打点包含 - 适合做后台聚合统计，但需过滤出真正由
import()触发的资源（可通过 URL 特征或添加查询参数标记）
示例标记方式：
// 加载时带 trace 标识
import('./features/report.js?trace=chart-report')再在 PerformanceObserver 中匹配 ?trace= 的资源进行采集。
与现有监控系统集成的关键点
上报动态导入耗时不是孤立行为，需对齐监控体系：
-
统一命名规范：指标名建议用
js.import.duration，标签包含module（路径 hash 或截断）、status、env - 采样控制：高频页面可能大量触发 import，需按需采样（如 10%），避免日志风暴
-
错误上下文补充：失败时附带
err.stack、navigator.connection.effectiveType、设备类型，便于归因 - 对比基线：记录首次加载（冷启动）与缓存命中（HTTP cache / V8 code cache）的耗时差异，识别优化空间
避开常见误区
实际落地中容易忽略的细节：
- 不要只看 network tab 时间：DevTools 显示的是 fetch 阶段，漏掉解析/编译/执行——这些在低端机上可能占 50%+ 耗时
-
避免重复计时：同一模块多次
import()，后续调用是 Promise 缓存，耗时趋近于 0，应排除或单独标记为cached -
慎用
console.time：它不支持异步 Promise 链自动关联，且部分浏览器中精度较低，优先用performance.now() -
注意 polyfill 影响：若使用
@babel/plugin-dynamic-import等转译，实际走的是System.import或require.ensure，耗时模型不同，需按实际运行时判断
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
