添加更多形状会减慢createjs中的FPS吗?

时间:2018-01-15 16:34:37

标签: createjs

我添加了37个形状,这是添加mousedown和mouseover事件处理程序的正确方法。这37个形状的性能并不慢,但随着100个形状的增加而增加。

for(var i = 1;i<37;i++)
{
    Independent_Bet_Shape = new createjs.Shape()
    Independent_Bet_Shape.graphics.beginFill("#FFFFFF").drawRect(0,0,Independent_Bet_Width,Independent_Bet_Height);
    Independent_Bet_Shape.alpha=0.8
    Independent_Bet_Shape.cache(0,0,Independent_Bet_Width,Independent_Bet_Height)

    Independent_Bet_Container.name = "Bet_Container"+i
Independent_Bet_Container.addChild(Independent_Bet_Shape)   
    s_oStage.addChild(Independent_Bet_Container)
    if(i%3 == 0) //Splitting them in column for every 3 bets from bottom to top.
    {               
        Current_Bet_X = Current_Bet_X+Independent_Bet_Width+0.1
        Current_Bet_Y = Start_Bet_Y                     
        for(var j = 0;j<3;j++)
        {
            Independent_Column_Bets_Array[columnCount][j] = j + (last_J + 1) 
        }       
        columnCount +=1     
        last_J = j * columnCount            
    }
}

for(var i = 1;i<37;i++)
{
    Selection_Bet_Container = new createjs.Container();
    Selection_Bet_Container.x = 5//-700
    Selection_Bet_Container.y = 5//-210

    Selection_Bets_Array.push(Selection_Bet_Container)
    Independent_Bets_Array[i].addChild(Selection_Bet_Container)
    Selection_Bet_Container.cache(0,0,Independent_Bet_Width,Independent_Bet_Height)
    Independent_Chips_Array.push(Selection_Bet_Container)
}
for(var i = 1;i<37;i++)
{
    Independent_Bets_Array[i].on("mousedown", Independent_TableBetFun);
    Independent_Bets_Array[i].cursor='pointer'

}

1 个答案:

答案 0 :(得分:1)

以下是快速概述:

  • 舞台必须重绘每一帧的所有内容。
  • 每帧绘制的内容越多,它就越慢。
  • 图形和文字硬件加速。这意味着您只能使用CPU渲染,这比绘制位图要慢得多。

你可以做很多事情来获得更好的表现:

  • 缓存形状。通过缓存它们,可以使用GPU渲染它们,这要快得多。很多缓存并不理想,但仍然比堆积图形更快。请参阅cache demo
  • 对不会更改的内容进行分组,并将其缓存。如果您要在舞台上添加不会更改的内容,或者作为一个组进行更改,那么缓存将提供巨大的性能优势。我们在绘制演示时使用了这种方法,它只为舞台绘制了新的内容,并没有清除舞台。

查看以下示例:

通常,粒子系统和其他高性能内容将使用位图,甚至是SpriteSheets,它们可以让您通过一个图像显示一堆不同的元素,这将为您带来巨大的性能优势。

如果你能够移动到位图或缓存的内容,check out StageGL,它支持大多数事情(像掩码这样的东西将不起作用 - 因为它们使用向量)。

干杯,