javascript - 衡量 Javascript 性能

Question

我正在尝试对我们的前端进行全面分析，我想知道是否有任何工具可以自动测量 Javascript。

例如：

执行功能（无需我手动将日期对象放在之前/之后来记录）
我页面上的哪个脚本最慢以及为什么
找出我需要优化的功能
我可以做任何 jQuery 改进吗（除了通过 John Resig 的jquery-profile.js）
- 我可以使用更好的选择器
- 在某些对象上记忆
- 使用更好的功能（例如：使用 find 因为它更快）

除了 Firebug、Chrome 开发工具、Yslow/Page speed 插件等之外，我几乎正在为我的 JS 寻找一个分析器（以及一些也可以分析 jQuery 的东西）。我正在寻找比 JSlint 更好的东西或jsPerf。

我在我的应用程序上运行了 New Relic，但它并没有告诉我我的脚本在哪里缺少。

我希望有一种比手动更简单的方法来分析我的 JS。我需要一个可以进行全面分析并为我提供包含指标的报告的解决方案。

score 3 · Accepted Answer

我想你正在寻找这样的东西：

从文档介绍到此：

使用 Speed Tracer，您可以更好地了解您的应用程序中花费的时间。这包括由 JavaScript 解析和执行、布局、CSS 样式重新计算和选择器匹配、DOM 事件处理、网络资源加载、计时器触发、XMLHttpRequest 回调、绘画等引起的问题。

score 2 · Accepted Answer

我最近遇到了这个，应该有助于衡量你的 javascript 代码性能 - http://www.html5rocks.com/en/tutorials/webperformance/usertiming/

score 1 · Accepted Answer

您还可以查看 Yahoo Boomrang提供的 javascript 库。它是捕获信标服务器上的用户体验并对其进行分类/分析的绝佳工具。

score 0 · Accepted Answer

这是我创建的一个工具：http: //yellowlab.tools

它使用 PhantomJS 加载页面并在页面加载时分析许多内容。启动测试，然后单击“JS Timeline”选项卡。您将找到与 DOM 交互的每个 JS 函数的日志，包括 jQuery 函数。

我用它来为我的客户审核 JS 代码，当您需要解开一些意大利面条代码或了解一些缩小的第三方小部件时，它是最好的现有工具！

score -1 · Accepted Answer

我真的怀疑您是否可以自动执行此操作，否则聘请高级开发人员来识别此类问题是没有意义的 :) 您可以做的是使用 Chrome 开发工具并使用 CPU 分析器和时间线工具手动检查您的页面，以查看正在运行的内容缓慢或造成内存泄漏的原因。

祝你好运

5 回答 5