Ich habe einen sehr einfachen Testfall erstellt, der eine Backbone-Ansicht erstellt, einen Handler an ein Ereignis anfügt und eine benutzerdefinierte Klasse instanziiert. Ich glaube, dass durch Klicken auf die Schaltfläche "Entfernen" in diesem Beispiel alles bereinigt wird und keine Speicherlecks auftreten sollten.
Eine jsfiddle für den Code finden Sie hier: 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();Ich bin mir jedoch nicht sicher, wie ich mit dem Profiler von Google Chrome überprüfen soll, ob dies tatsächlich der Fall ist. Es gibt eine Unmenge Dinge, die im Snapshot des Heap-Profilers angezeigt werden, und ich habe keine Ahnung, wie ich entschlüsseln kann, was gut / schlecht ist. In den Tutorials, die ich bisher gesehen habe, werde ich entweder nur aufgefordert, "den Snapshot-Profiler zu verwenden" oder mir ein äußerst detailliertes Manifest zur Funktionsweise des gesamten Profilers zu geben. Ist es möglich, den Profiler nur als Werkzeug zu verwenden, oder muss ich wirklich verstehen, wie das Ganze entwickelt wurde?
BEARBEITEN: Tutorials wie diese:
Behebung von Google Mail-Speicherlecks
Sind repräsentativ für einige der stärkeren Materialien da draußen, von dem, was ich gesehen habe. Abgesehen von der Einführung des Konzepts der 3-Schnappschuss-Technik bieten sie jedoch nur sehr wenig praktisches Wissen (für einen Anfänger wie mich). Das Tutorial "Verwenden von DevTools" funktioniert nicht anhand eines realen Beispiels, daher ist die vage und allgemeine konzeptionelle Beschreibung der Dinge nicht besonders hilfreich. Wie für das Beispiel "Google Mail":
Sie haben also ein Leck gefunden. Was jetzt?
Untersuchen Sie den Haltepfad von durchgesickerten Objekten in der unteren Hälfte des Bedienfelds „Profile“
Wenn die Zuweisungsstelle nicht leicht abgeleitet werden kann (dh Ereignis-Listener):
Instrumentieren Sie den Konstruktor des Aufbewahrungsobjekts über die JS-Konsole, um die Stapelverfolgung für Zuordnungen zu speichern
Verwenden Sie Closure? Aktivieren Sie das entsprechende vorhandene Flag (z. B. goog.events.Listener.ENABLE_MONITORING), um die Eigenschaft createdStack während der Erstellung festzulegen
Nachdem ich das gelesen habe, bin ich verwirrter, nicht weniger. Und wieder sagt es mir nur, dass ich Dinge tun soll , nicht wie ich sie tun soll. Aus meiner Sicht sind alle Informationen entweder zu vage oder würden nur für jemanden Sinn machen, der den Prozess bereits verstanden hat.
Einige dieser spezifischeren Probleme wurden in der Antwort von @Jonathan Naguin unten angesprochen .
main10.000 statt einmal aufzurufen und zu prüfen , ob am Ende viel mehr Speicher verwendet wird.
