Dieser Artikel beschreibt die Gedächtnislecks von JavaScript und Gedächtnisverwaltungsfähigkeiten, die sehr praktisch sind. Teilen Sie es für Ihre Referenz. Die spezifischen Methoden sind wie folgt:
Der Inhalt dieses Artikels stammt vom 26. August 2014 von Google WebPerf (London WebPerf Group).
Im Allgemeinen müssen effiziente JavaScript -Webanwendungen reibungslos und schnell sein. Jede Anwendung, die mit Benutzern interagiert, muss überlegen, wie der Speicher effizient verwendet wird. Wenn die Seite zu viel verzehrt wird, stürzt ab und zwingt den Benutzer zum Nachladen. Und Sie können sich nur in der Ecke verstecken und weinen.
Die automatische Müllsammlung ist kein Ersatz für ein effektives Speichermanagement, insbesondere in großen, langjährigen Webanwendungen. In diesem Artikel werden wir demonstrieren, wie wir das Gedächtnis über Chromes Devtools effektiv verwalten können.
Und lernen Sie, wie Sie Leistungsprobleme wie Speicherlecks, häufige Müllsammlung und allgemeine Speicherblauen lösen, Dinge, die Sie wirklich die Energie kosteten.
Addy Osmani zeigt viele Beispiele in seinem PPT, die in Chrome V8 Speicherlecks verursachen:
1) Löschen Sie eine Objekteigenschaft, um dieses Objekt zu verlangsamen (15 -mal mehr Speicher zu verbrauchen).
var o = {x: 'y'}; löschen ox; // zu diesem Zeitpunkt wird o ein langsamer Objekt Ochsen; // var o = {x: 'y'}; o = null; // das sollte sein2) Schließung
Bei der Einführung von Variablen außerhalb des Verschlusses in den Verschluss kann dieses Objekt beim Ende des Verschlusses nicht Müll gesammelt (GC) sein.
var a = function () {var frearstr = new Array (1000000) .Join ('x'); return function () {return larstr; }} ();3) DOM -Leck
Wenn der ursprüngliche COM entfernt wird, kann die Sub-Node-Referenz nicht recycelt werden, wenn sie nicht entfernt wird.
var select = document.querySelector; var treeref = select ('#baum'); // Im COM -Baum ist Leafref ein untergeordneter Knoten von Baumfre var leafref = select ('#leaf'); var body = select ('body'); body.removechild (treeref); //#Baum kann nicht zurückgezahlt werden, da TREEREF immer noch da ist // Lösung: TREEREF = NULL; // Baum kann nicht zurückgezahlt werden, weil Leafref immer noch da ist, Leafref = NULL; // jetzt #Tree kann veröffentlicht werden.4) Timerzählungszählungs -Timer -Leck
Timer sind auch häufige Orte, an denen Speicherlecks auftreten:
für (var i = 0; i <90000; i ++) {var buggyObject = {Callagain: function () {var ref = this; var val = setTimeout (function () {ref.callagain ();}, 90000); }} buggyObject.callagain (); // Obwohl Sie recyceln möchten, ist der Timer immer noch fehlerhaft = null;}5) Erinnerung debuggen
Das Debugging -Tool von Chromes eigenem Speicher kann die Speicherverwendung und Speicherlecks problemlos anzeigen:
Klicken Sie in Timeline -> Speicher: Speicher: Speicher:
Ich hoffe, dieser Artikel wird für JavaScript -Programmierung aller hilfreich sein.