Bir Omurga görünümü oluşturan, bir olaya bir işleyici ekleyen ve kullanıcı tanımlı bir sınıfı başlatan çok basit bir test örneği oluşturdum. Bu örnekteki "Kaldır" düğmesini tıklatarak her şeyin temizleneceğini ve bellek sızıntısı olmaması gerektiğine inanıyorum.
Kod için bir jsfiddle burada: 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();
Ancak, gerçekte durumun bu olduğunu doğrulamak için Google Chrome'un profil oluşturucusunu nasıl kullanacağım belirsiz. Öbek profiler anlık görüntüsünde ortaya çıkan bir gazilyon şey var ve iyi / kötü olanı nasıl çözeceğimi bilmiyorum. Ben şimdiye kadar gördüğüm öğreticiler ya sadece "anlık görüntü profiler kullanmak" ya da bana tüm profiler nasıl çalıştığı hakkında ayrıntılı bir manifesto vermek söyle. Profil oluşturucuyu bir araç olarak kullanmak mümkün mü, yoksa her şeyin nasıl tasarlandığını gerçekten anlamak zorunda mıyım?
EDIT: Bunun gibi öğreticiler:
Gmail bellek sızıntısı düzeltmesi
Gördüğüm kadarıyla, dışarıdaki daha güçlü materyallerin bazılarını temsil ediyorlar. Bununla birlikte, 3 Enstantane Tekniği kavramını tanıtmanın ötesinde , pratik bilgi açısından (benim gibi yeni başlayanlar için) çok az sunduklarını düşünüyorum. 'DevTools'u Kullanma' öğreticisi gerçek bir örnekle çalışmaz, bu yüzden meselelerin belirsiz ve genel kavramsal açıklaması aşırı derecede yararlı değildir. 'Gmail' örneğine gelince:
Yani bir sızıntı buldun. Şimdi ne olacak?
Profiller panelinin alt yarısında sızan nesnelerin tutma yolunu inceleyin
Tahsis yeri kolayca çıkarılamazsa (yani olay dinleyicileri):
Tahsis nesnesinin yapıcısını JS konsolu üzerinden ayırma için yığın izlemesini kaydetmek için kullanın
Kapanış mı Kullanıyorsunuz? İnşaat sırasında createStack özelliğini ayarlamak için mevcut uygun bayrağı (yani goog.events.Listener.ENABLE_MONITORING) etkinleştirin
Bunu okuduktan sonra kendimi daha karışık buluyorum, daha az değil. Ve yine, bu sadece beni anlatıyor etmek yapmak değil, şeyleri nasıl bunları yapmak için. Benim bakış açımdan, dışarıdaki tüm bilgiler ya çok belirsiz ya da sadece süreci zaten anlayan birine mantıklı geliyordu.
Bu daha spesifik konulardan bazıları, @Jonathan Naguin'in aşağıdaki cevabında gündeme gelmiştir .
main
kez yerine 10.000 kez aramak ve sonunda kullanımda çok daha fazla bellek olup olmadığını görmek olabilir.