我创建了一个非常简单的测试案例，它创建了一个Backbone视图，将处理程序附加到事件上，并实例化了一个用户定义的类。我相信通过在此示例中点击“删除”按钮，一切都将被清除，不应该有内存泄漏。
这里是代码的jsfiddle链接：http://jsfiddle.net/4QhR2/
这里是代码的jsfiddle链接：http://jsfiddle.net/4QhR2/
// scope everything to a function
function main() {
function MyWrapper() {
this.element = null;
}
MyWrapper.prototype.set = function(elem) {
this.element = elem;
}
MyWrapper.prototype.get = function() {
return this.element;
}
var MyView = Backbone.View.extend({
tagName : "div",
id : "view",
events : {
"click #button" : "onButton",
},
initialize : function(options) {
// done for demo purposes only, should be using templates
this.html_text = "<input type='text' id='textbox' /><button id='button'>Remove</button>";
this.listenTo(this,"all",function(){console.log("Event: "+arguments[0]);});
},
render : function() {
this.$el.html(this.html_text);
this.wrapper = new MyWrapper();
this.wrapper.set(this.$("#textbox"));
this.wrapper.get().val("placeholder");
return this;
},
onButton : function() {
// assume this gets .remove() called on subviews (if they existed)
this.trigger("cleanup");
this.remove();
}
});
var view = new MyView();
$("#content").append(view.render().el);
}
main();
然而，我不清楚如何使用Google Chrome的分析器来验证这是否是事实。在堆分析器快照中会出现无数东西，我不知道如何解码什么是好的/坏的。到目前为止我看到的教程要么只是告诉我“使用快照分析器”，要么就给我一个非常详细的宣言，介绍整个分析器是如何工作的。我能否只把分析器当做一个工具使用，或者我真的必须了解整个工程过程呢？
编辑: 例如这些教程：
根据我所见，这些代表了一些更强大的材料。然而，除了介绍“3快照技术”的概念外，我发现它们在实用知识方面（对于像我这样的初学者）提供的帮助非常有限。 “使用DevTools”教程没有通过真实示例进行讲解，因此其对事物的模糊和一般性描述并不是非常有用。至于“Gmail”示例：
我读完后反而更加困惑了，没有更清晰的理解。再次强调，它只是告诉我要做什么，而不是如何做。在我看来，所有的信息都太模糊了，或者只有那些已经理解该过程的人才能理解。下面@Jonathan Naguin's answer中提出了一些更具体的问题。那么你发现了一个泄漏，现在该怎么办？
检查Profiles面板下泄漏对象的保留路径
如果无法轻松推断分配站点（即事件侦听器）：
通过JS控制台仪器化保留对象的构造函数，以保存分配的堆栈跟踪
正在使用Closure？ 启用适当的现有标志（即goog.events.Listener.ENABLE_MONITORING）以在构建期间设置creationStack属性
main10,000 次而不是一次，然后看最终是否有更多的内存正在被使用。 - Paul D. Waite