当我画帆布使用kineticjs时，内存增加非常快

Question

我使用HTML5和kineticjs库创建游戏。我使用Nodejs启动服务器。代码：

function animate() { 
    newDraw() 

    // Request a new animation frame using Paul Irish's shim 
    window.requestAnimFrame(animate); 
}; 

function newDraw() 
{ 

    if(typeof localPlayer != 'undefined') { 

     var layernew = new Kinetic.Layer(); 
     var stg = new Kinetic.Stage({ 
      container: 'container', 
      width: 500, 
      height: 300 
     }); 

     var data = localPlayer.newdraw(); 
     layernew.add(new Kinetic.Text(data.Text)) 
     layernew.add(new Kinetic.Rect(data.rect)) 

     stg.add(layernew) 

    } 
} 

内requestAnimationFrame.js文件

// shim layer with setTimeout fallback 
window.requestAnimFrame = (function(){ 
    return window.requestAnimationFrame  || 
      window.webkitRequestAnimationFrame || 
      window.mozRequestAnimationFrame || 
      window.oRequestAnimationFrame  || 
      window.msRequestAnimationFrame  || 
      function(/* function */ callback, /* DOMElement */ element){ 
      window.setTimeout(callback, 100); 
      }; 
})(); 

它正常工作，但内存的增加速度非常快=>火狐浏览器崩溃。 请帮我修复这个bug。 非常感谢！

Answer 1

问题是：

你正在创建每个动画循环期间附加级+层+元素。

很快你会有数百个对象都占用内存。

相反：

创建阶段+层+文字+ RECT一旦动画开始之前。

然后使用各种object.set ...命令在每个动画循环中操作现有的文本+ rect。