javascript - 如何在浏览器中调试内存泄漏、无限循环和执行 Javascript？

Question

在浏览器中检查 javascript 中的无限循环的推荐方法是什么？假设我打开 Chrome，它崩溃了，有没有办法断点或以某种方式查明崩溃发生的位置？

然后我想知道，我如何在浏览器中查看正在执行的脚本的运行列表(比如我忘记跟踪的某个计时器正在运行并且它正在减慢速度)？最好在 Chrome/Safari 中使用，但 Firefox 也可以。

我一直在使用元素检查器/控制台，只是还没有想出有效调试这 3 个东西的方法。

谢谢!

Answer 1

1。内存泄漏

• Microsoft JavaScript Memory Leak Detector (即)
• Drip (即)
• Leak monitor (FF)

2。无限循环

在复杂的无限循环分布在数百个函数中的情况下，我不完全理解浏览器会向您指出什么。当然，我希望浏览器能够精确定位简单的循环，例如某些函数在 15 秒内不返回。但至少我们有一些东西，浏览器告诉你 a) 脚本运行缓慢，和 b) 调用了哪些函数以及每个函数花费了多少时间。此外，您还可以设置断点并观看它逐步运行。

3。监控定时器和间隔

打开 WebKit 的时间线面板，点击“记录”并监控您可能想知道的关于每个计时器和间隔的所有信息。如果您不使用 WebKit，您可以自己编写一些简单的代码:

_setTimeout = setTimeout
setTimeout = function(fn, time) {
  var timeout = _setTimeout(function() {
    console.log('Timeout #' + timeout + ' fired on ' + (fn.name || 'anonymous'))
    fn()
  }, time)
  return timeout
}

通常我只是让 document.title 在超时/间隔触发时闪烁。

4。一般代码性能

• Speed Tracer适用于谷歌浏览器
• Firebug Paint Events火狐浏览器
• Javascript Performance Monitor - 一个小信息框，可帮助您监控 FPS 和内存分配