在 javascript 运行时中查看 track 耗时，核心方法是使用浏览器开发者工具中的 performance 面板进行录制与分析。具体做法是打开 devtools，切换到 performance 标签页，点击录制按钮执行目标操作，停止后在时间轴上查找标记为 "track" 或相关自定义事件的长条，通过其宽度直接读取耗时数值。

如何定位 Track 事件的具体耗时

定位 Track 事件耗时的关键在于识别 Performance 面板中的 Event 类型条目。在录制结束后，展开主线程的调用栈，寻找类型为 "Event" 且名称包含 "Track" 或业务逻辑对应的事件节点。该节点的横向跨度即代表其持续时间，鼠标悬停可显示精确到毫秒的起止时间和时长。

const trackStart = performance.now();
// ... 执行追踪逻辑 ...
const trackEnd = performance.now();
console.log(`Track Duration: ${trackEnd - trackStart}ms`);

如何通过代码手动注入 Track 耗时数据

若需更精细地控制 Track 耗时的记录方式，可以在代码中使用 performance.mark() 和 performance.measure() API 手动创建测量点。这种方法会将耗时数据直接写入性能缓冲区，便于后续通过 performance.getEntriesByName() 获取结构化数据，适合自动化测试或需要持久化存储的场景。

modern-javascript-patterns

掌握 ES6+ 特性，包括 async/await、解构、扩展运算符、箭头函数、Promise、模块、迭代器、生成器以及函数式编程模式，编写简洁高效的 Java

下载

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

performance.mark('track-start');
// ... 执行追踪逻辑 ...
performance.mark('track-end');
performance.measure('track-duration', 'track-start', 'track-end');
const entries = performance.getEntriesByName('track-duration');
console.log(entries[0].duration);

Track 耗时分析中常见的性能瓶颈是什么

在 Track 耗时分析中，常见的性能瓶颈通常集中在主线程阻塞、大量 DOM 操作或同步网络请求上。当 Track 事件耗时异常高时，检查 Performance 面板中是否有长任务（Long Task）或样式计算（Style Recalculation）重叠，这些往往是导致追踪延迟的直接原因。