Я створив дуже простий тестовий випадок, який створює перегляд Backbone, приєднує обробник події та інстанціює визначений користувачем клас. Я вважаю, що натиснувши кнопку "Видалити" в цьому зразку, все буде очищено і не повинно бути витоків пам'яті.
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 переконатися, що це насправді так. Є кілька мільйонів речей, які відображаються на знімку профілів купи, і я не маю уявлення, як розшифрувати, що добре / що погано. Підручники, які я бачив на ньому до цього часу, або просто кажуть мені "використовувати профайл знімка", або дають мені дуже детальний маніфест про те, як працює весь профілер. Чи можна просто використовувати профайлер як інструмент, чи мені справді потрібно зрозуміти, як була спроектована вся справа?
EDIT: Підручники на кшталт цих:
Виправлення витоку пам’яті Gmail
Представляють деякі сильніші матеріали з того, що я бачив. Однак, крім введення концепції 3-х знімкової техніки , я вважаю, що вони пропонують дуже мало з точки зору практичних знань (для початківця, як я). Підручник "Використання DevTools" не працює через реальний приклад, тому його розпливчастий та загальний концептуальний опис речей не надто корисний. Що стосується прикладу "Gmail":
Так ви знайшли витік. А тепер що?
Вивчіть утримуючий шлях просочених предметів у нижній половині панелі "Профілі"
Якщо сайт розподілу неможливо легко зробити (тобто слухачі подій):
Інструментуйте конструктор утримуючого об'єкта через консоль JS, щоб зберегти слід стека для виділень
Використовуєте закриття? Увімкніть відповідний існуючий прапор (тобто goog.events.Listener.ENABLE_MONITORING), щоб встановити властивість createStack під час будівництва
Я вважаю себе більш розгубленим, прочитавши це, не менше. І, знову ж таки, це просто підказує мені робити речі, а не як їх робити. З моєї точки зору, вся інформація там або занадто розпливчаста, або мала б сенс лише той, хто вже зрозумів процес.
Деякі з цих більш конкретних питань були порушені у відповіді @Jonathan Naguin нижче.
main10 000 разів замість одного разу та побачити, чи закінчується ви набагато більше пам’яті, яка використовується в кінці.
