如何对JavaScript性能进行分析和优化

Question

如何对JavaScript性能进行分析和优化

javascriptperformancememory-leaksprofiling

27

可能重复：
什么是JavaScript执行的最佳分析方法？

我有几个使用jQuery编写的脚本，我认为其中一个存在内存泄漏问题。

如何对脚本进行分析，找出哪些部分占用了最多的内存/CPU？

- Eli

8个回答

10

使用Firebug。引用自http://getfirebug.com/js.html：

使用分析器，只需进入“Console”选项卡并单击“Profile”按钮。然后使用您的应用程序一段时间或重新加载页面，然后再次单击“Profile”按钮。然后，您将看到一个详细报告，显示调用了哪些函数以及每个函数花费了多少时间。

- msanders

4

我建议您查看Firebug中的分析器和IE中的Drip插件，以帮助查找内存泄漏问题。

此外，请记住，大多数JavaScript内存泄漏来自DOM对象和JavaScript对象之间的循环引用未在卸载DOM对象时断开。为了防止这种情况发生，建议避免在DOM对象属性中创建对JavaScript对象的引用（例如，避免像document.getElementById('foo').bar = myObject;这样的代码）。如果必须创建这些循环引用，请确保在页面卸载前或卸载DOM对象之前使用函数自行断开它们。

- pkaeding

2

谷歌浏览器还拥有个人资料选项。

- Vestel

1

另一种测试特定代码的简单方法是在其周围添加一个计时器。

var testStart = new Date();

// code to be tested here

$('#jstest').html("selected function: "+ (new Date() - testStart) + " milliseconds");

其中 jstest 是页面上某个可见的 span 元素。

- macca1

1

虽然Chrome内置了分析选项，但它并不能提供关于对象的精确信息。因此，我更喜欢使用JavaScript泄漏查找工具，这对我的代码有所帮助。

https://code.google.com/p/leak-finder-for-javascript/

希望这能有所帮助。

- sid

你回答这个问题有点晚了，但非常感谢提供有趣的链接。 - Viktor S.

0

Firebug或Google的Page Speed for Firefox都有分析工具。

- Eimantas

0

John Resig（jQuery）的这篇文章可能对在IE中检测内存泄漏很有帮助：

http://ejohn.org/blog/deep-tracing-of-internet-explorer/

- David Murdoch

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Miguel Ventura · Accepted Answer

关于内存消耗

JavaScript中的内存泄漏通常被忽视，除非它们变成浏览器内存泄漏（即使用户从页面导航离开后，内存仍然被分配，并且没有办法释放它）。原因是虽然您的Web应用程序可能存在一些内存泄漏，但用户会从一个页面转到另一个页面，因此泄漏得到了最小化。但是他们可能不会重新启动浏览器，所以浏览器内存泄漏可能很严重。某些JavaScript代码已知会在某些浏览器上引起内存泄漏，其中Internet Explorer可能是这方面最糟糕的浏览器。因此，您可以找到Microsoft JavaScript Memory Leak Detector非常有用。

关于时间

IE、Chrome和Safari提供了与浏览器一起发布的Web开发工具中内置的分析器。对于Firefox，您可以使用Firebug。由于您正在使用jQuery，这意味着您的分析报告将充满匿名函数等，使其难以阅读。因此，John Resig的jQuery分析插件非常有用，它将向您提供更清晰的输出。