キャンバスを削除するときにImageDataを解放する

Question

私はHTML Canvasを使ってXULアプリケーションを作成し、ビットマップイメージを表示しています。 私はImageDatasを生成し、putImageData機能を使用してキャンバスにそれらをインポートしています：

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); 
    } 

画像がうまくインポートされますがputImageData機能によるメモリリークがあるように思われます。

"for"ループを終了すると、Canvasに割り当てられたメモリが解放されることが期待されますが、putImageDataを実行せずにコードを実行すると、最後のプログラムが100Mbを使用しなくなります大きい）。

putImageData関数は、ガベージコレクタが割り当てられたメモリを解放することを防ぐことができました。

メモリを解放するようにガベージコレクタを強制する方法はありますか？ Canvasを空にする方法はありますか？

私はすでにdelete演算子を使ってキャンバスを削除しようとしましたが、clearRect関数を使用しようとしましたが、何もしませんでした。

私も各反復で画像を表示するために、同じキャンバスを再利用しようとしましたが、メモリの使用量が...既存のものを削除せずにインポートされたイメージかのように、

Answer 1

を変更しなかったあなたが試みることができますループの後にキャンバスをクリアします。あなたのコードを見ると、まだimgCanvasTmpに到達可能で、ガベージコレクションできません。ガベージコレクタが起動するには、ブラウザを数分間アイドル状態にする必要があります。また、imageDatasもクリアしたいことがあります。