PixiJS消耗了大量的GPU

Question

所以我在Pixi中有一个场景，里面有大约7-8个纹理。几个只是循环简单的变换(例如像风扇一样旋转等(，有些是静态的。

在完全没有与它交互的情况下(它在一个单独的窗口中(，它的出现就让我的16BG i7 MacBook Pro疯狂发热，占用了50%的CPU。

下面是一个我如何设置旋转动画的例子。里面有什么可疑的东西吗？我简直不敢相信它消耗了多少电力，我即将扔掉我所有的Pixi代码，只使用CSS，因为它看起来更高效。

rotorPositions.forEach((rotor, index) => {
const sprite = new PIXI.Sprite(resources.rotor.texture)
sprite.position.set(foregroundContainer.width/100 * rotor[0], foregroundContainer.height/100 * rotor[1])
foregroundContainer.addChild(sprite)
sprite.anchor.x = 0.5
sprite.anchor.y = 0.616
let speed = 0.03
sprite.zIndex = 3
if(index == 1){
speed = 0.04
sprite.rotation = 0.5
}
app.ticker.add(() => {
sprite.rotation += speed
})
})

Answer 1

预加载纹理并尝试使用cacheAsBitmap属性。它拍摄显示对象的快照，从而获得更好的性能。

这里有一个例子：多个纹理的例子与cacheAsBitmap

编辑：您正在使用foreach循环。循环可能非常棘手，可以使用console.log并打印一个计数器变量来查看循环执行的次数。