无需登录 数据私有 本地保存

JavaScript 代码执行计时器 - 测量函数运行耗时

12
0
0
0

JavaScript 代码执行计时器

使用 performance.now() 高精度测量函数运行耗时，支持多次运行统计分析

test-code.js
📊 数组排序 📝 字符串拼接 🔢 数学计算 📦 对象访问 🗺️ Map 操作 🔄 循环遍历
×100 ×1K ×10K ×100K 无 ×5 ×10 ×20
常见问题与知识点
如何使用这个 JavaScript 代码计时器？
在代码编辑器中输入您想要测试的 JavaScript 代码（函数体），设置运行次数（建议 1000~10000 次以获得稳定结果）和预热次数（让 JIT 编译器优化代码），然后点击"开始计时"。工具会循环执行您的代码，记录每次的耗时，并展示总耗时、平均耗时、最快/最慢、中位数、标准差以及每秒操作数 (ops/s) 等统计指标。您也可以点击预设标签快速加载示例代码进行体验。
performance.now() 和 Date.now() 有什么区别？为什么用 performance.now()？
Date.now() 返回的是 Unix 时间戳（毫秒级），精度仅到毫秒，且受系统时间调整影响。performance.now() 返回从页面加载开始的高精度时间（精度可达微秒级，通常为 5μs 的倍数），不受系统时间变化影响，是 W3C High Resolution Time API 的一部分。对于测量代码执行耗时（尤其是毫秒级以下的操作），performance.now() 是业界标准选择，能提供更准确的测量结果。
为什么需要"预热"（Warmup）？
现代 JavaScript 引擎（如 V8、SpiderMonkey）使用即时编译 (JIT) 技术。代码在前几次执行时，引擎会进行解释执行和 baseline 编译；随着执行次数增加，引擎识别到"热点代码"后会进行优化编译 (Optimizing Compilation)，生成更高效的机器码。预热运行可以触发这些优化，使正式计时时的代码处于优化后的稳定状态，得到更真实、更稳定的性能数据。通常 3~10 次预热就足够触发大多数 JIT 优化。
如何解读统计结果中的各项指标？
  • 总耗时：所有运行次数的累计时间。
  • 平均耗时：单次运行的平均时间，最常用的性能指标。
  • 最快 / 最慢：单次运行的最小/最大耗时，帮助发现性能波动。
  • 中位数：排序后位于中间的耗时值，比平均值更能抵抗极端值干扰。
  • 标准差：反映各次运行耗时的离散程度。标准差越小，性能越稳定。
  • 操作/秒 (ops/s)：每秒可执行的次数，数值越大性能越好。计算公式：运行次数 ÷ 总耗时(秒)。
为什么同段代码多次测试结果会不一样？
这是正常现象，原因包括：① 垃圾回收 (GC)——JavaScript 引擎在运行过程中会间歇性进行垃圾回收，导致某些运行耗时突然增加（在分布图中可看到红色尖峰）；② CPU 调度——操作系统将 CPU 时间分配给不同进程/线程，后台任务可能影响测试；③ JIT 编译抖动——引擎可能在不同优化层级之间切换。为获得可靠结果，建议进行足够多次的运行（1000+ 次），并关注中位数和标准差而非单次数据。
如何优化 JavaScript 代码性能？有哪些常见技巧？
一些实用技巧：① 避免不必要的 DOM 操作——批量更新 DOM，使用 DocumentFragment；② 使用 Map/Set 替代 Object/Array 进行频繁查找（O(1) vs O(n)）；③ 减少闭包创建——在循环中避免创建新函数；④ 使用 for 循环替代 forEach——在高性能场景下，传统 for 循环通常更快；⑤ 字符串拼接——大量拼接时使用数组 join() 而非 +=；⑥ 缓存计算结果——避免重复计算相同的值。您可以使用本工具对比优化前后的代码，量化性能提升。
这个工具支持测试异步函数吗？
当前版本主要针对同步代码进行高精度计时。如果您的代码包含异步操作（async/await、Promise、setTimeout 等），由于事件循环的特性，单次运行的耗时测量会变得复杂。您可以将异步逻辑的核心同步部分提取出来进行测试，或者将异步操作包装为同步可测量的单元。未来版本可能会加入专门的异步代码计时模式。
运行次数设置多少比较合适？
这取决于代码的执行速度：极快操作（< 10μs）如简单算术、属性访问，建议 10000~100000 次；中等操作（10μs~1ms）如数组排序、字符串处理，建议 1000~10000 次；较慢操作（> 1ms）如 DOM 操作、大量计算，建议 100~1000 次。总的原则是让总测试时间在 100ms~2s 之间，既能获得足够样本又不让用户等待太久。如果不确定，从 1000 次开始，根据结果调整。
🔧 相关工具