Stworzyłem bardzo prosty przypadek testowy, który tworzy widok Backbone, dołącza procedurę obsługi do zdarzenia i tworzy instancję klasy zdefiniowanej przez użytkownika. Uważam, że po kliknięciu przycisku „Usuń” w tym przykładzie wszystko zostanie wyczyszczone i nie powinno być żadnych wycieków pamięci.
Plik jsfiddle dla kodu jest tutaj: 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();Nie mam jednak pewności, jak używać profilera Google Chrome, aby sprawdzić, czy tak jest w rzeczywistości. Jest miliard rzeczy, które pojawiają się na migawce programu profilującego sterty i nie mam pojęcia, jak rozszyfrować, co jest dobre, a co złe. Samouczki, które widziałem do tej pory, albo po prostu mówią mi, żebym „użył profilera migawek”, albo podają bardzo szczegółowy manifest na temat działania całego profilera. Czy można po prostu użyć programu profilującego jako narzędzia, czy naprawdę muszę zrozumieć, jak wszystko zostało zaprojektowane?
EDYCJA: Poradniki takie jak te:
Naprawianie wycieku pamięci w Gmailu
Są reprezentatywne dla niektórych silniejszych materiałów, z tego, co widziałem. Jednak poza przedstawieniem koncepcji 3 Snapshot Technique , uważam, że oferują one bardzo mało praktycznej wiedzy (dla początkującego takiego jak ja). Samouczek „Korzystanie z narzędzi dla programistów” nie opiera się na prawdziwym przykładzie, więc jego niejasny i ogólny koncepcyjny opis rzeczy nie jest zbyt pomocny. Jeśli chodzi o przykład „Gmail”:
Więc znalazłeś wyciek. Co teraz?
Sprawdź ścieżkę mocowania przecieków w dolnej połowie panelu Profile
Jeśli nie można łatwo wywnioskować lokalizacji alokacji (tj. Nasłuchiwania zdarzeń):
Instrumentuj konstruktora obiektu przechowującego za pośrednictwem konsoli JS, aby zapisać ślad stosu dla alokacji
Używasz zamknięcia? Włącz odpowiednią istniejącą flagę (np. Goog.events.Listener.ENABLE_MONITORING), aby ustawić właściwość createStack podczas tworzenia
Po przeczytaniu tego jestem bardziej zdezorientowany, a nie mniej. I znowu, po prostu mówi mi, żebym coś robił , a nie jak to robić. Z mojej perspektywy wszystkie dostępne informacje są albo zbyt niejasne, albo miałyby sens tylko dla kogoś, kto już zrozumiał ten proces.
Niektóre z tych bardziej szczegółowych kwestii zostały poruszone w odpowiedzi @Jonathana Naguina poniżej.
main10000 razy zamiast jednego razu i sprawdzenie, czy na końcu zostanie użytych dużo więcej pamięci.
