JavaScript 怎么使用性能计时 API 测量代码耗时-js教程-PHP中文网

performance.now()是最精准、推荐的代码执行耗时测量方式，基于高精度时间戳（毫秒级，精确至微秒），不受系统时间调整影响，优于date.now()和console.time()。

javascript 怎么使用性能计时 api 测量代码耗时

JavaScript 使用 performance.now() 是最精准、推荐的方式测量代码执行耗时，它基于高精度时间戳（单位为毫秒，精确到微秒级），不受系统时间调整影响，比 Date.now() 或 console.time() 更可靠。

用 `performance.now()` 手动计时

在关键代码段前后调用 performance.now()，相减即得耗时（单位：毫秒，通常保留 3 位小数）：

const start = performance.now();
// ⚙️ 你要测量的代码
for (let i = 0; i

使用 `performance.mark()` 和 `performance.measure()` 做语义化标记

适合复杂流程中多个阶段的耗时分析，支持命名标记、跨函数测量、后续通过 performance.getEntriesByType('measure') 查询：

JavaStoryDevelop

你接手一个需求时，是不是经常这样："改一个小字段 → 结果把不相关的代码也改了"、"需求说得很模糊 → 做着做着发现跑偏了"、"数据库加个字段 → 上线才发现漏了数据兼容"、"做了个新功能 → 一个月后自己都忘了当时怎么设计的"、"写到一半被中断 → 再回来不知道从哪继续"；这个 Skill 就是专门解决这些问题的。它会自动探测你的项目环境（JDK、Spring Boot、ORM、数据库、前端框架），记在

下载

performance.mark('start-fetch');
fetch('/api/data')
  .then(() => performance.mark('end-fetch'))
  .then(() => performance.measure('fetch-duration', 'start-fetch', 'end-fetch'));
<p>// 后续可读取所有 measure 记录
const measures = performance.getEntriesByType('measure');
measures.forEach(m => {
console.log(<code>${m.name}: ${m.duration.toFixed(2)} ms</code>);
});
</p>

注意浏览器兼容性与初始化时机

所有现代浏览器都支持（Chrome 25+、Firefox 15+、Safari 8+、Edge 12+）。但需注意：

页面未加载完成前（如 script 放在中）也能用，performance 对象在全局环境始终可用
避免用 Date.now() 替代 —— 它受系统时钟跳变、NTP 同步影响，精度仅毫秒级，且可能倒流
console.time() 虽方便，但非标准 API，部分环境（如某些 Node.js 版本或严格 CSP 策略下）可能受限或精度较低

简单封装一个可复用的计时器工具

提升可读性和复用性，适合调试或性能监控：

function createTimer(label) {
  const start = performance.now();
  return {
    end() {
      const duration = performance.now() - start;
      console.log(`${label}: ${duration.toFixed(3)} ms`);
      return duration;
    }
  };
}
<p>// 使用示例
const timer = createTimer('Array processing');
const arr = Array.from({ length: 1e5 }, (_, i) => i ** 2);
arr.sort((a, b) => b - a);
timer.end(); // → "Array processing: 8.214 ms"
</p>