javascript - 当前浏览器中的闭包和 (jQuery) DOM 事件导致内存泄漏?

标签 javascript jquery browser memory-leaks

我是 javascript 的新手,在追踪内存泄漏时似乎遇到了一些问题。由于代码相当复杂,我已将其缩小到似乎会导致内存泄漏的部分。我将发布一个不同的示例,该示例将其简化但会导致相同的问题(只是小得多)。

Code Example

基本上,我有一些动态构建 HTML 并将事件附加到 HTML 的代码。每次 AJAX 请求都会重建 HTML。第一次这一切都很好,但在每次 AJAX 请求之后,浏览器内存都会增加(并不总是相等的)!可以通过在 jsfiddle 上多次单击运行并观察浏览器内存来重现此问题。我的假设是创建的闭包永远不会被垃圾收集,但我不确定?如果是这种情况,是否有更好的方法来执行此操作而不会导致任何问题的闭包?

这发生在 FF8、最新版本的 Chrome 和 IE 8 中。最有可能的是所有其他 - 正是我测试过的。

我在代码中添加了一些注释,应该会有帮助。

谢谢!

编辑: 好的,在使用 sIEve 进行更多研究之后,我可以看到每次 AJAX 调用时 DOM 节点的数量都会翻倍。我已经更新了这个例子来模拟这个。所以我的问题是为什么在调用 jQuery empty 或 remove 函数后 DOM 元素没有被垃圾收集?我还遍历了 stuff 中的元素,解除了事件处理程序的绑定(bind),并将每个 DOM 元素 js 引用设置为 null 而没有影响...

Code Example

最佳答案

这与 DOM 的 GC 和 JavaScript GC 不是 friend 有关。基本要点是,如果某物被 DOM 引用,JS GC 可能不会销毁它,反之亦然。这个想法可能已经过时了,因为它出现在 Crockford 的书中,这本书已经有几代浏览器了。

我在这里看到一些潜在的问题,这些问题可能是 JS Fiddle 特有的,但也可能不是:

  • 是否需要分配F?
  • 您在这里一次创建大量 DOM 元素,
  • 您在每次运行时都重新创建 F,因此 DOM 的 GC 比 JavaScript 的 GC 更有可能出现问题
  • JavaScript 的 GC 是一种标记清除扫描器,这意味着它是“惰性的”。您可以在脚本中看到这一点 - 如果您运行它十次,内存使用率会飙升到非常高的水平,但最终被遗弃的对象会被垃圾回收,内存使用率会下降。
  • 您需要担心的闭包是分配给 click 元素的闭包,但您在这里没有使用闭包。

但我没有看到任何真正的问题,几分钟后我的内存使用率恢复正常。

简而言之,您没有内存泄漏(至少是紧迫的泄漏),您的 JS 解释器的 GC 只是懒惰。您放弃了很多 DOM 元素,这是不好的,也是您的内存激增的原因,但这是短期的性能影响,而不是长期的页面加载问题。

关于javascript - 当前浏览器中的闭包和 (jQuery) DOM 事件导致内存泄漏?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8408011/

相关文章:

javascript - .css() Jquery 方法使整个文档不起作用

javascript - 使用另一个数组作为引用获取对象属性值

javascript - 使用 JavaScript/jQuery 创建同心圆

javascript - 浏览器窗口居中问题

browser - Google Chrome 下拉列表选项顺序似乎不正确

javascript - 如何使用 javascript 设置边框样式?

javascript - 滚动到幻灯片顶部切换

javascript - 使用 PHP 使用 HTML 表单选项选择器过滤 MYSQL 结果

javascript - 使用 meteor 模板助手获取 DOM 元素

css - Win8 上的字体端IE 版本兼容性调试工具(从IE 8 9 10 11 轻松转换)是什么?