User Timing API 通过结构化标记与measure精确测量各环节耗时：按流程分层命名、避免动态拼接、用measure替代手动计算，并支持跨线程时间对齐与DevTools可视化分析。
用 User Timing API 精确记录复杂逻辑每一步耗时，关键不是堆砌标记，而是让标记有结构、可定位、能回溯。它不替代 Performance 面板的宏观视图，但能把“哪一段卡了”从猜测变成证据。
按执行流程分层打点，避免标记泛滥
不要只在函数开头结尾各 mark 一次。对多步骤逻辑（比如“解析 → 校验 → 转换 → 合并”），每个环节边界都应有明确标记：
-
入口统一命名前缀：如
process-step1-parse、process-step2-validate，便于后续用正则或脚本批量筛选 -
嵌套操作加子级标识：若校验含多个字段，可用
validate-field-a、validate-field-b，避免所有校验混成一个长区间 -
避免动态拼接名：不用
performance.mark('step-' + i)，名称需静态可检索；运行时差异用 measure 的 start/end 组合体现
用 measure 替代手动减法，保证精度与可读性
别再写 const t1 = performance.now(); doWork(); const t2 = performance.now(); console.log(t2 - t1)。直接用 measure：
- 先打两个 mark：
performance.mark('start-transform')和performance.mark('end-transform') - 再调用：
performance.measure('transform-duration', 'start-transform', 'end-transform') - 结果自动出现在
performance.getEntriesByType('measure')中，单位毫秒，精度达微秒级，且不受系统时间调整影响
结合 Worker 场景，跨线程对齐时间轴
主线程和 Worker 各自调用 performance.mark()，时间戳默认独立计时，但可通过共享起始锚点对齐：
立即学习“前端免费学习笔记（深入）”；
- 主线程发消息前记：
performance.mark('worker-start') - Worker 收到后立刻记：
self.performance.mark('worker-received') - 主线程收到响应后再记：
performance.mark('worker-end') - 三者虽属不同上下文，但用
getEntriesByName()分别提取，再比对数值差，就能算出通信延迟与纯计算耗时
录制后快速验证与导出分析
标记不会自动显示在 DevTools Performance 面板——需手动启用：
- 录制时勾选 User Timing 轨道（位于底部“More tracing categories”中）
- 录制完成后，在时间轴底部找到绿色 User Timing 轨道，所有
mark和measure会以带名称的横条形式直观呈现 - 右键导出 JSON，用脚本过滤出所有
entryType: 'measure'的数据，按 duration 排序，一眼锁定最慢环节
