我的kincetjs阶段经常更新,但实际上并不令人难以置信-每2-5秒大约1次。 此阶段包含约50-200个图像对象:

_renderDices: function() {
  var dt0 = (new Date()).getTime();


  this.diceLayer.removeChildren();
  this.diceLayer.clear();

  var dt3 = (new Date()).getTime();

  for ( var j = 0 ; j < this.imagesCount; j++) {
        var image = new Kinetic.Image({
            x: this.images[j].X,
            y: this.images[j].Y,
            image: this.images[j].imageObj,
            width: this.width ,
            height: this.height,
            listening: false
        });
        this.diceLayer.add(image);
  }

  var dt2 = (new Date()).getTime();

  this.diceLayer.draw();

  var dt1 = (new Date()).getTime();

  console.log("renderTime " + (dt1 - dt0 ) + " ms, drawTime: " + (dt1 - dt2) + " ms , clearTime: " + (dt3-dt0)+"ms children=" + this.diceLayer.children.length);

},

但很快(在2-3k次迭代后),渲染性能从5ms降低到1000-2000msg。 我已经测试了chrome和firefox,它看起来像是GC问题,但我不确定。 可能还没有另一种可能会生成带有图像的舞台-我有大约20个不同的图像(50x50-不是很大),其投影为50-200。

但是无论如何,我无法相信kinectjs在如此少量的对象上应该表现得很差-可能是我做错了什么,并且我的对象没有正确清理。

#1楼 票数:2 已采纳

removeChildren将删除舞台上的子级, 但会将这些删除的子保留在内存中,以备日后重新添加时使用。

因此,您正在积累被删除的子项,这最终会降低性能。

如果您不打算以后再使用子代,请使用destroyChildren代替。

  ask by Oleg translate from so

未解决问题?本站智能推荐:

1回复

eticjs性能落后

我正在研究类似于HTML5命运之轮示例的径向控件。 我在这里用一些我需要的其他功能的示例修改了原始文档 : http : //jsfiddle.net/fEm9P/当您单击内部动力学楔形物时,它们将在较大的楔形物中收缩和扩展。 不幸的是,当我旋转轮子时,它落后于指针。 这里还算不错,但在移
2回复

碰撞检测性能差

我正在使用KineticJs构建游戏,并且正在使用拖放操作在屏幕上移动元素,所以我遇到了很大的性能问题,因为我检查了dragmove事件,如果您拖动的元素与可能的捕捉位置发生碰撞,然后拖动元素得到了全部ggy。 我使用的是内置函数的dynamicJ,但是我感觉它们的优化效果不佳。 它实际上在
1回复

动画性能随着时间的推移而下降

我正在尝试使用KineticJS创建2D HTML画布动画。 图像将作为背景加载到html5画布,并且正在尝试将其水平移动。 最初,代码运行良好。 几秒钟后,移动速度降低并开始卡住,最后chrome / firefox将停止响应。
1回复

KinetcJS:使用Sprite时的拖动性能非常差

我像这样使用Kinetic Sprite 问题是,在手机上使用精灵时,拖动性能会非常差。 移动或调整精灵大小非常慢。 有没有增加阻力性能的方法? 编辑:这是一个带有Kinetic Image的示例,其中在Android版Chrome浏览器中拖动非常缓慢: http : //
1回复

Kinetic.js遮罩的图像在Firefox上性能下降

我是动力学的新手,我对性能问题一无所知。 我创建了这个示例 ,您只需要单击黑白图像并将其拖动到上面,然后是一个彩色圆圈。 chrome,ipad上的Safari甚至Android手机上的Opera Mobile的性能都相当不错。 在firefox中,它可以正常运行,但是如果您将鼠标
1回复

Kinectisj:剩余鼠标轨迹的问题(层问题)

我正在做一个自学游戏。 我的目标是在鼠标指针后留下一条痕迹。(这有效)但是,当我在chrome上打开并运行它时。 经过一定的高度和宽度后,小径将留在画布上,而不是被擦掉。 谁能帮我这个? 这是它的小提琴: http : //jsfiddle.net/Frm27/4/但请在chro
3回复

KineticJS鼠标事件问题

我正在尝试与KineticJS制作某种交互式地图,其中悬停的地方会加载其他图像。 但我不能使鼠标事件正常工作。 事情是,一切正常, 但只有第一次鼠标悬停尝试,当我第二次悬停时, mouseout触发器不起作用:( 即当我第二次进行“mouseout”时,我希望地图部分再次为浅蓝色(n_
2回复

KineticJS setScale / Zoom问题 - 随机线

如果我用KineticJS设置比例/变焦,我会得到一个奇怪的错误。 出现随机线条。 编辑1:好的。 看起来如果我将scaleRate设置为0.25,0.125,0.02525等就可以了。 还有其他修复吗? 编辑2:好吧。 EDIT1并不是一个真正的解决方案。 如果我缩放整个