Wie JavaScript-Schließungen durch Müll gesammelt werden

Ich habe den folgenden Chrome-Fehler protokolliert , der zu vielen schwerwiegenden und nicht offensichtlichen Speicherverlusten in meinem Code geführt hat:

(Diese Ergebnisse verwenden den Speicherprofiler von Chrome Dev Tools , mit dem der GC ausgeführt wird, und erstellen dann einen Heap-Snapshot von allem, was nicht gesammelt wurde.)

Im folgenden Code ist die someClassInstanz Müll gesammelt (gut):

var someClass = function() {};

function f() {
  var some = new someClass();
  return function() {};
}

window.f_ = f();

In diesem Fall wird jedoch kein Müll gesammelt (schlecht):

var someClass = function() {};

function f() {
  var some = new someClass();
  function unreachable() { some; }
  return function() {};
}

window.f_ = f();

Und der entsprechende Screenshot:

Es scheint, dass ein Abschluss (in diesem Fall function() {}) alle Objekte "am Leben" hält, wenn das Objekt von einem anderen Abschluss im selben Kontext referenziert wird, unabhängig davon, ob dieser Abschluss selbst erreichbar ist oder nicht.

Meine Frage betrifft die Speicherbereinigung der Schließung in anderen Browsern (IE 9+ und Firefox). Ich bin mit den Tools des Webkits wie dem JavaScript-Heap-Profiler ziemlich vertraut, kenne aber nur wenige Tools anderer Browser, sodass ich dies nicht testen konnte.

In welchem ​​dieser drei Fälle sammeln IE9 + und Firefox-Garbage die someClass Instanz?

Soweit ich das beurteilen kann, handelt es sich nicht um einen Fehler, sondern um das erwartete Verhalten.

Auf der Speicherverwaltungsseite von Mozilla : "Ab 2012 liefern alle modernen Browser einen Mark-and-Sweep-Garbage-Collector aus." "Einschränkung: Objekte müssen explizit unerreichbar gemacht werden " .

In Ihren Beispielen, wo es fehlschlägt, someist im Verschluss noch erreichbar. Ich habe zwei Möglichkeiten ausprobiert, um es unerreichbar zu machen, und beide funktionieren. Entweder Sie setzen, some=nullwenn Sie es nicht mehr brauchen, oder Sie setzen window.f_ = null;und es wird weg sein.

Aktualisieren

Ich habe es in Chrome 30, FF25, Opera 12 und IE10 unter Windows versucht.

Der Standard sagt nichts über die Speicherbereinigung aus, gibt aber einige Hinweise darauf, was passieren sollte.

• Abschnitt 13 Funktionsdefinition, Schritt 4: "Der Abschluss sei das Ergebnis der Erstellung eines neuen Funktionsobjekts gemäß 13.2."
• Abschnitt 13.2 "Eine durch Scope angegebene lexikalische Umgebung" (scope = Schließung)
• Abschnitt 10.2 Lexikalische Umgebungen:

"Die äußere Referenz einer (inneren) lexikalischen Umgebung ist eine Referenz auf die lexikalische Umgebung, die die innere lexikalische Umgebung logisch umgibt.

Eine äußere lexikalische Umgebung kann natürlich eine eigene äußere lexikalische Umgebung haben. Eine lexikalische Umgebung kann als äußere Umgebung für mehrere innere lexikalische Umgebungen dienen. Wenn eine Funktionsdeklaration beispielsweise zwei verschachtelte Funktionsdeklarationen enthält, haben die lexikalischen Umgebungen jeder der verschachtelten Funktionen als äußere lexikalische Umgebung die lexikalische Umgebung der aktuellen Ausführung der umgebenden Funktion. "

Eine Funktion hat also Zugriff auf die Umgebung des übergeordneten Elements.

Sollte somealso beim Schließen der Rückgabefunktion verfügbar sein.

Warum ist es dann nicht immer verfügbar?

Es scheint, dass Chrome und FF klug genug sind, um die Variable in einigen Fällen zu entfernen, aber sowohl in Opera als auch in IE ist die someVariable im Closure verfügbar (Hinweis: Um dies anzuzeigen, setzen Sie einen Haltepunkt return nullund überprüfen Sie den Debugger).

Der GC könnte verbessert werden, um festzustellen, ob er somein den Funktionen verwendet wird oder nicht, aber er wird kompliziert.

Ein schlechtes Beispiel:

var someClass = function() {};

function f() {
  var some = new someClass();
  return function(code) {
    console.log(eval(code));
  };
}

window.f_ = f();
window.f_('some');

Im obigen Beispiel kann der GC nicht feststellen, ob die Variable verwendet wird oder nicht (Code getestet und funktioniert in Chrome30, FF25, Opera 12 und IE10).

Der Speicher wird freigegeben, wenn der Verweis auf das Objekt durch Zuweisen eines anderen Werts unterbrochen wird window.f_.

Meiner Meinung nach ist dies kein Fehler.

Ich habe dies in IE9 + und Firefox getestet.

function f() {
  var some = [];
  while(some.length < 1e6) {
    some.push(some.length);
  }
  function g() { some; } //removing this fixes a massive memory leak
  return function() {};   //or removing this
}

var a = [];
var interval = setInterval(function() {
  var len = a.push(f());
  if(len >= 500) {
    clearInterval(interval);
  }
}, 10);

Live Seite hier .

Ich hoffte, mit einem Array von 500 function() {}mit minimalem Speicherplatz fertig zu werden.

Das war leider nicht der Fall. Jede leere Funktion enthält ein (für immer nicht erreichbares, aber nicht GC-fähiges) Array mit einer Million Zahlen.

Chrome wird schließlich angehalten und stirbt, Firefox beendet das Ganze, nachdem fast 4 GB RAM verwendet wurden, und der IE wächst asymptotisch langsamer, bis "Nicht genügend Speicher" angezeigt wird.

Durch Entfernen einer der kommentierten Zeilen wird alles behoben.

Es scheint, dass alle drei dieser Browser (Chrome, Firefox und IE) eine Umgebungsaufzeichnung pro Kontext und nicht pro Abschluss führen. Boris vermutet, dass der Grund für diese Entscheidung die Leistung ist, und das scheint wahrscheinlich, obwohl ich nicht sicher bin, wie performant sie angesichts des obigen Experiments genannt werden kann.

Wenn ein Verweis benötigt wird some(vorausgesetzt, ich habe ihn hier nicht verwendet, aber stellen Sie sich vor, ich hätte ihn verwendet), wenn statt

function g() { some; }

ich benutze

var g = (function(some) { return function() { some; }; )(some);

Es wird die Speicherprobleme beheben, indem der Abschluss in einen anderen Kontext als meine andere Funktion verschoben wird.

Dies wird mein Leben viel langweiliger machen.

PS Aus Neugier habe ich dies in Java versucht (mit seiner Fähigkeit, Klassen innerhalb von Funktionen zu definieren). GC funktioniert so, wie ich es mir ursprünglich erhofft hatte.

Die Heuristiken variieren, aber eine übliche Methode zur Implementierung dieser Art besteht darin, für jeden Anruf f()in Ihrem Fall einen Umgebungsdatensatz zu erstellen und nur die Einheimischen zu speichern f, die tatsächlich (durch einen Abschluss) in diesem Umgebungsdatensatz geschlossen sind. Dann jede Schließung, die im Aufruf erstellt wurde, um fden Umgebungsdatensatz am Leben zu erhalten. Ich glaube, so implementiert Firefox zumindest Verschlüsse.

Dies hat den Vorteil eines schnellen Zugriffs auf geschlossene Variablen und einer einfachen Implementierung. Es hat den Nachteil des beobachteten Effekts, dass ein kurzlebiger Verschluss, der über eine Variable schließt, dazu führt, dass er durch langlebige Verschlüsse am Leben erhalten wird.

Man könnte versuchen, mehrere Umgebungsdatensätze für verschiedene Schließungen zu erstellen, je nachdem, was sie tatsächlich schließen, aber das kann sehr schnell sehr kompliziert werden und selbst Leistungs- und Speicherprobleme verursachen ...

1. Status zwischen Funktionsaufrufen beibehalten Angenommen, Sie haben die Funktion add () und möchten, dass alle in mehreren Aufrufen übergebenen Werte hinzugefügt werden und die Summe zurückgegeben wird.

wie add (5); // gibt 5 zurück

addiere (20); // gibt 25 (5 + 20) zurück

addiere (3); // gibt 28 (25 + 3) zurück

Zwei Möglichkeiten, wie Sie dies zuerst tun können, sind normal. Definieren Sie eine globale Variable. Natürlich können Sie eine globale Variable verwenden, um die Summe zu speichern. Aber denken Sie daran, dass dieser Typ Sie lebendig essen wird, wenn Sie (ab) Globals verwenden.

Jetzt neueste Methode mit Closure ohne definierte globale Variable

(function(){

  var addFn = function addFn(){

    var total = 0;
    return function(val){
      total += val;
      return total;
    }

  };

  var add = addFn();

  console.log(add(5));
  console.log(add(20));
  console.log(add(3));
  
}());