Backbonejs App 中的内存泄漏问题答案

【问题标题】：memory leak issue in Backbonejs AppBackbonejs App 中的内存泄漏问题
【发布时间】：2013-06-07 15:12:35
【问题描述】：

我使用Backbonejs 和Requirejs 来创建单页网络应用程序。我的应用好像有memory leaks。

为了测试，我创建了一个示例代码。它创建一个视图对象，调用其render 函数并将返回的html 附加到DOM。
返回的html 有一个button。点击按钮后，其callback 调用destroy 函数，视图被销毁。

但是，当我运行chrome heap profilier 时，我可以看到detached DOM tree 仍然徘徊。深入其中，可以看到jQuery 保存的references。

我怀疑这是否是内存泄漏。如果是，mycode 没有保留任何引用。那么问题出在jQuery 吗？

这是link 示例代码。
我还附上了堆快照的屏幕截图。

【问题讨论】：

作为一般建议：在处理此类问题时，请尝试隔离每个元素：摆脱 requirejs 以便在调试时减少处理。另一个建议是升级到 Backbone 1.0.0 并使用新的listenTo 和stopListening 函数，这些函数正是为了处理这类问题而引入的。请记住，在视图上调用 remove 也会调用 stopListening。
@gustavohenke 骨干网没有任何内存泄漏问题。它们是由开发人员创建的 :)
如果您有内存问题，请开始查看所有处理程序的位置...可能是某些处理程序被您的视图隐式设置，而 remove 无法处理。
@amchang87 请看第三张图片，你会注意到主干没有保留任何参考，它的 jQuery。
@namero999 我没有监听任何模型的事件，我只是在 DOM 中附加了一些 html。我现在的泄漏问题不是模型，而是分离的 DOM 树，它占用了很大一部分我的原始应用程序中的内存。

【解决方案1】：

使用主干构建的应用程序通常会因孤立视图而导致内存泄漏。我使用木偶来处理这个问题，它为我管理我的观点。直接使用主干不是一种典型的方法，因为它实际上是一个开发框架的工具包。

【讨论】：

实际上，Backbone 可以直接使用而无需额外的框架，并且确实被大量开发人员直接使用。但是，您关于孤立视图的观点是有效的。管理孤立视图的清理应该是任何骨干实现的标准过程。
我实际上并不同意骨干可以直接使用。我在软件开发的各个方面都非常有经验，去年我自己也使用过骨干网。当我搬到 Marionette 时，我松了一口气，我删除了一半的代码。我总是会推荐 Marionette 而不是直接骨干。
@EngineerDollery 我用过木偶。它对我来说做得很棒，但在这种情况下，我也在清理我的视图，所以视图被孤立的事实更少。现在我最担心的是泄漏 DOM 树。如果你看到最后一张图片，你会注意到 jQuery 保留了一些参考资料。请您仔细阅读我的代码，它非常简单，这表明了我的担忧。
@EngineerDollery 我想我应该说：许多人选择直接使用 Backbone 管理内存泄漏，这是完全可能的，许多人选择使用为他们做这件事的框架。归根结底，框架在幕后做着同样的事情。任何一种选择都是有效的，这取决于个人喜好，是的，为你做这件事的框架可能会节省很多时间:)

【解决方案2】：

通过这个链接你会得到更多的想法，你可能会找到解决问题的可能方法

祝你好运希望你快点解决这个问题

【讨论】：