backbone.js - 防止 Backbone 僵尸 View

Question

注意:我们使用的是 Backbone 1.0.0

我对 Backbone 比较陌生，并且打算通过前同事编写的一些代码。我不是盲目地复制粘贴东西，而是想了解他是如何做事的，这就是我开始思考处理僵尸 View 的最佳方式的时候。

var view = new editItemView({ model: this.model });
    this.ui.editItemPopup.html(view.render().el).modal({ modalOverflow: true });

这将创建一个 View 实例并将其以 boostrap 模式弹出。该模型具有保存更改、取消和删除按钮。我们将看看在保存更改和删除上完成的干净工作。

onDelete: function() {
    this.stopListening(this.model);
    this.$el.parent().modal('hide');
    this.$el.remove();
},
onApplyChangesClick: function () {
    this.stopListening(this.model);
    this.close();
},
close: function () {
    this.$el.parent().modal('hide');
}

据我所知，这段代码不会丢弃 View 。如果我要在上述 View 中添加另一个监听器

this.listenTo(this.model.AnotherItem, 'change', this.doSomething);

然后在 this.model.AnotherItem 上触发 change 事件，this.doSomething 仍然会触发。正确的？

在发布此问题之前，我对 Zombie View 进行了一些阅读。 http://lostechies.com/derickbailey/2011/09/15/zombies-run-managing-page-transitions-in-backbone-apps/

根据那篇文章，如果我这样做，我会不会更好

 onDelete: function() {
    this.close()
},
onApplyChangesClick: function () {
    this.close();
},
close: function () {
    this.$el.parent().modal('hide');
    this.remove();
}

his.remove() 将自动调用 stopListening 并删除 dom 元素(与 this.$el.remove 相同)

我发布的文章也使用了 this.unbind()

this.unbind()will unbind any events that our view triggers directly – that is, anytime we may have calledthis.trigger(…)` from within our view, in order to have our view raise an event.

在 Backbone 1.0.0(或最新版本)中仍然需要这样做吗？这篇文章已有 3 年历史，所以我想知道，我在 Backbone 文档中找不到任何提及 view.unbind 的内容。文档提到 unbind 是 off 的别名。所以我应该这样做

this.remove();
this.off();

Answer 1

好的，首先让我声明一个显而易见的事实:这里或那里的一些僵尸 View 不会给您带来任何问题。任何给定的僵尸 View 都会消耗少量内存，然后在用户点击刷新或导航离开时消失。所以，如果你对清理你的引用有点草率，一般来说事情仍然可以正常工作。当你有很多僵尸 View 时，你会遇到问题，比如说因为你渲染了一个 20x100 的表格，其中每个单元格都有自己的 View .

现在，要真正了解如何避免僵尸 View ，您必须了解内存在 Javascript 中是如何工作的。我鼓励你在其他地方阅读更多关于它的内容，但这里是悬崖笔记版本:任何你“停止使用”的东西都会被浏览器的垃圾收集器清理掉，因为垃圾收集器不能准确地告诉你什么时候“停止使用”某些东西它实际上取决于该事物是否在其他对象上对它有任何引用。

这就是事件绑定(bind)发挥作用的地方，因为它们可以创建防止 View 被垃圾收集的引用。 Backbone 的功能之一是，如果这些绑定(bind)是作为 Backbone.View 的一部分制作的，它会处理清理这些绑定(bind)。的初始化(即，您放入 events 类的 View 属性中的事件)。因此，如果您删除 View的元素从页面中，它将被垃圾收集......

...除非它有其他引用，例如使用它的另一个对象，或者您使用 jQuery 创建的事件绑定(bind)。所以，只要你的 View s 没有任何其他您是正确的引用:只需删除元素就足够了。但是，如果您确实有任何其他引用，则需要清理它们，否则 View不会被垃圾收集，将成为僵尸 View 。