Phaser.Gameのインスタンスを破壊する適切な方法は何ですか？

Phaser.Gameのインスタンスを作成してから破棄するという単純なケースでは、メモリリークがあるようです。以下に、完全な実例を示します。ボタンをクリックしてインスタンスを作成し、再度クリックしてインスタンスを破棄します。ボタンを繰り返しクリックすると、メモリ使用量が制限なく増加します。代わりに私がやるべきであるフェイザーのライフサイクルについて何か不足していますか？Phaser.Gameのインスタンスを破壊する適切な方法は何ですか？

私はこれをjsfiddleではなくcode snippetとして投稿しています。なぜなら、問題を見るためにメモリプロファイラなどを探す必要があるため、jsfiddleは問題を複雑にするだけです。

<!doctype html> 
<html> 
<head> 
<meta charset="UTF-8"/> 
<title>test</title> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/phaser-ce/2.8.1/phaser.js"> 
</script> 
</head> 
<body> 
    <button id="button">Click</button> 
    <div id="canvas"></div> 
    <script> 
     window.onload = function() { 
     var d, n, game; 

     d = document.getElementById('button'); 
     n = document.getElementById('canvas'); 

     function preload() { 
     } 
     function create() { 
     } 
     function update() { 
     } 
     function handler() { 
      if(game) { 
        game.destroy(); 
        game = null; 
      } else { 
        game = new Phaser.Game(800, 600, Phaser.AUTO, n, { 
          preload:  preload, 
          create:   create, 
          update:   update 
        }); 
      } 
     } 
     d.onclick = handler; 
     }; 
    </script> 
</body> 
</html>

出典

2017-06-24 jbg

「私はJSの専門家ではないが、これは単にである可能性がありますまだGCでクリーンアップされていませんか？ – displayname

いいえ - メモリは、待機するかガベージコレクションを強制する（たとえば、Chromeのデベロッパーツールを使用するなど）ことによってガベージコレクションされません。 – jbg

私自身の質問に答えると、問題はPhaser.CanvasPoolにあります。新しいPhaserインスタンスが作成されるたびに、新しいキャンバスが作成され、プールに追加されます。インスタンスを破棄すると、プールからキャンバスが削除されたり、再利用可能とマークされたりすることはありません。

game.destroy（）を呼び出した後、Phaser.CanvasPool.pool = []を設定したような気がすることがありますが、複数のフェイザーインスタンスがある場合は動作しません。

正しいワークフローが何を想定しているか知っていれば知りたいです--- Phaser.CanvasPoolは、PIXIとの接触のフェイザーのポイントの1つであり、それらのすべてが文書化されていないようです。

EDIT：メモリリークの原因が見つかりました。 Phaser.Utils.Debug.boot（）は、呼び出されるたびに新しいキャンバスをプールに追加します。このキャンバスは、デフォルトでは、フェイザーインスタンスが作成されて起動されるたびに設定されます。

この問題は、enableDebugが有効な場合（デフォルト）、WebGLレンダリングされたキャンバスにのみ影響します。完全を期すため、ここでは、デバッグを無効にし、したがって、メモリリークを示さない上記のコードの編集されたバージョンは、

です：

<!doctype html> 
<html> 
<head> 
<meta charset="UTF-8"/> 
<title>test</title> 
<script src="http://cdnjs.cloudflare.com/ajax/libs/phaser-ce/2.8.1/phaser.js"></script> 
</head> 
<body> 
<button id="button">Click</button> 
<div id="canvas"></div> 
<script> 
window.onload = function() { 
    var d, n, game; 

    d = document.getElementById('button'); 
    n = document.getElementById('canvas'); 

    function preload() { 
    } 
    function create() { 
    } 
    function update() { 


    } 
    function handler() { 
      if(game) { 
        game.destroy(); 
        game = null; 
      } else { 
        game = new Phaser.Game({ 
          width:   800, 
          height:   600, 
          renderer:  Phaser.AUTO, 
          parent:   n, 
          enableDebug: false, 
          state:   { 
            preload:  preload, 
            create:   create, 
            update:   update 
          }, 
        }); 
      } 
    } 
    d.onclick = handler; 
}; 
</script> 
</body> 
</html>

出典

2017-06-26 22:01:29 jbg

Phaser.Gameのインスタンスを破壊する適切な方法は何ですか？

答えて

関連する問題