2011-01-17 3 views
0

Ich schreibe eine XUL-Anwendung mit HTML Canvas, um Bitmap-Bilder anzuzeigen. Ich Erzeugung ImageDatas und sie in einer Leinwand Import der putImageData Funktion:Befreien von ImageData beim Löschen eines Canvas

for(var pageIndex=0;pageIndex<100;pageIndex++){ 
    this.img = imageDatas[pageIndex]; 

    /* Create the Canvas element */ 
    let imgCanvasTmp = document.createElementNS("http://www.w3.org/1999/xhtml",'html:canvas'); 
    imgCanvasTmp.setAttribute('width', this.img.width); 
    imgCanvasTmp.setAttribute('height', this.img.height); 

    /* Import the image into the Canvas */ 
    imgCanvasTmp.getContext('2d').putImageData(this.img, 0, 0); 

    /* Use the Canvas into another part of the program (Commented out for testing) */ 
    // this.displayCanvas(imgCanvasTmp,pageIndex); 
    } 

Die Bilder sind gut eingeführt, aber es scheint aufgrund der putImageData Funktion ein Speicherverlust zu sein.

Beim Verlassen der "for" -Schleife würde ich erwarten, dass der für Canvas freigegebene Speicher freigegeben wird, aber durch Ausführen des Codes ohne putImageData habe ich festgestellt, dass mein Programm am Ende 100Mb weniger verwendet (meine Bilder sind ziemlich) groß).

Ich kam zu der Schlussfolgerung, dass die PutImageData-Funktion verhindert, dass der Garbage Collector den zugewiesenen Speicher freigibt.

Haben Sie eine Idee, wie ich den Müllsammler zwingen könnte, den Speicher freizugeben? Gibt es eine Möglichkeit, den Canvas zu leeren?

Ich habe bereits versucht, die Leinwand mit dem Löschen-Operator zu löschen oder die clearRect-Funktion zu verwenden, aber es hat nichts getan.

Ich habe auch versucht die gleiche Leinwand wieder zu verwenden bei jeder Iteration, aber die Größe des Speichers zur Anzeige des Bildes nicht geändert genutzt, als ob das Bild, wo zu löschen, ohne die bestehenden importiert ...

+0

[This] (https://developer.mozilla.org/en/debugging_memory_leaks) kann helfen –

Antwort

0

Sie könnten versuchen, Löschen der Leinwand nach der Schleife Wenn Sie Ihren Code ansehen, ist immer noch erreichbar und es kann kein Müll gesammelt werden. Beachten Sie, dass Sie den Browser möglicherweise für ein paar Minuten im Leerlauf lassen müssen, bevor der Garbage Collector eingreifen kann. Vielleicht möchten Sie auch imageDatas löschen.

+0

Nachdem ich meine Frage gepostet habe, habe ich versucht, "imgCanvasTmp" mit let-Schlüsselwort zu deklarieren, so dass es im Loop-Bereich bleibt, aber es tut funktioniert auch nicht. (Ich bearbeite meinen Code). Ich habe auch versucht, die Leinwand in this.imgCanvasTmp zu speichern und löschte es am Ende mit delete (this.imgCanvasTmp), aber ich hatte immer noch Speicherverlust. Ich glaube nicht, ImageDatas ist das Problem, da ich keinen Speicherverlust haben, wenn Sie die putImageData() -Funktion herausnehmen ... – revers