Actionscript 3 低性能(?)在椋鸟身上有200个移动圆圈

Actionscript 3 低性能(?)在椋鸟身上有200个移动圆圈,actionscript-3,starling-framework,Actionscript 3,Starling Framework,我有这段代码,它用200个圆形绘制了一个雨一样的动画。 基本上有200个圆形,具有随机的x,y,半径和速度,从上到下,当屏幕存在时,会以随机的x(再次)重置回顶部。。。在LG G2上,我得到了每秒26帧的200个圆圈,我怀疑我做错了什么,因为我知道椋鸟可以做得比这更好 主要内容: 粒子: private var particles:Array = []; public function Particle() { addEventListener(Event.AD

我有这段代码,它用200个圆形绘制了一个雨一样的动画。 基本上有200个圆形,具有随机的x,y,半径和速度,从上到下,当屏幕存在时,会以随机的x(再次)重置回顶部。。。在LG G2上,我得到了每秒26帧的200个圆圈,我怀疑我做错了什么,因为我知道椋鸟可以做得比这更好

主要内容:

粒子:

private var particles:Array = [];

    public function Particle()
    {
        addEventListener(Event.ADDED_TO_STAGE, init);
    }

    private function init(event:Event):void {
        for (var i:int=0;i<200;i++) {
            particles[i] = new Circle();
            addChild(particles[i]);
        }

        addEventListener(Event.ENTER_FRAME, update);
    }

    private function update(event:Event):void {
        for (var i:int=0;i<particles.length;i++) {
            particles[i].update();
        }
    }
我做错了吗?有没有更好的方法达到同样的效果


谢谢

您不能将旧代码从classic AS3复制粘贴到Starling,您需要使用新的逻辑来优化和利用这些优势

  private var particles:Array = [];
  private var speeds:Array = [];

 private var MAX_SPEED = 10;
 private var MIN_SPEED = 1;

private var filter0:ColorMatrixFilter = new ColorMatrixFilter();
private var filter1:ColorMatrixFilter = new ColorMatrixFilter();
private var filter2:ColorMatrixFilter = new ColorMatrixFilter();
private var filter3:ColorMatrixFilter = new ColorMatrixFilter();
private var filter4:ColorMatrixFilter = new ColorMatrixFilter();
private var COLORS:Array = [filter0, filter1, filter2, filter3, filter4];


 // Embed the texture:
 [Embed(source="circle.png")]    //<---- EMBED A CRICLE PNG
  public static const Circle:Class;

public function Particle()
{
    addEventListener(Event.ADDED_TO_STAGE, init);
}

var texture:Texture = Texture.fromBitmap(new Circle());
private function init(event:Event):void {
    filterRed.tint(0xff7729, 1);
    filterRed.tint(0x1ab58a, 1);
    filterRed.tint(0xffebca, 1);
    filterRed.tint(0xff2151, 1);
    filterRed.tint(0xffad29, 1);

    for (var i:int=0;i<200;i++) {
        particles[i] = new Image(texture);

        shuffle(i);


        addChild(particles[i]);
    }

    addEventListener(Event.ENTER_FRAME, update);
}

private function update(event:Event):void {
    for (var i:int=0;i<particles.length;i++) {
        update(i);
    }
}

public function update(imageID:int):void {
    particles[imageID].x = x;
    particles[imageID].y += speeds[imageID];
    if (_image.y > Starling.current.nativeStage.stageHeight) {
        shuffle(i);
    }
}

public function shuffle(i:int):void {
    particles[i].scaleX = particles[i].scaleY = Math.floor(Math.random() * this.MAX_RADIUS/particles[i].width) + this.MIN_RADIUS/particles[i].width;
    particles[i].filter = this.COLORS[Math.floor(Math.random() * this.COLORS.length)];
    speeds[i] = Math.floor(Math.random() * this.MAX_SPEED) + this.MIN_SPEED;
    particles[i]._x = Math.floor(Math.random() * Starling.current.nativeStage.stageWidth);
    particles[i]._y = Math.floor(Math.random() * Starling.current.nativeStage.stageHeight) - Starling.current.nativeStage.stageHeight;
}
private-var-particles:Array=[];
私有变量速度:数组=[];
专用var最大转速=10;
专用var最小速度=1;
私有变量过滤器0:ColorMatrixFilter=new ColorMatrixFilter();
私有变量过滤器1:ColorMatrixFilter=new ColorMatrixFilter();
私有变量过滤器2:ColorMatrixFilter=new ColorMatrixFilter();
私有变量过滤器3:ColorMatrixFilter=new ColorMatrixFilter();
私有变量过滤器4:ColorMatrixFilter=new ColorMatrixFilter();
私有变量颜色:数组=[filter0,filter1,filter2,filter3,filter4];
//嵌入纹理:

[Embed(source=“circle.png”)]//您为每个圆创建一个唯一的位图数据,这意味着您在渲染之前强制Starling绘制200次,这太多了。BotMaster是正确的。每个新的位图数据都需要绘制调用。另外,我建议你们阅读Starling关于优化的文章——谢谢你们,但我想我还是遗漏了一些东西(即使在阅读了优化页面之后)。。。我假设有一种方法可以重用一个位图数据,或者让它同时绘制所有200个圆,但我想不出一种方法来实现这一点。。。有机会得到提示或指示吗?考虑将一个
位图数据
传递给所有
对象。然后了解如何使用一个图形对象来完成所有绘图-如果可以避免所有这些
addChild()
调用,您将大大提高性能。最后一个建议是不相关的,因为您最终仍会有200个绘图调用。您只需要一个图像。从位图开始,为所有圆使用白色,然后使用Starling对象的“着色”属性更改该颜色。你应该只需要一次抽签就可以得到你想要的圈数。
private var _x:int = 0;
    private var _y:int = 0;
    private var _speed:int = 0;
    private var _radius:int = 0;
    private var _color:uint = 0x000000;

    private var MIN_RADIUS:int = 2;
    private var MAX_RADIUS:int = 14;
    private var MIN_SPEED:int = 8;
    private var MAX_SPEED:int = 14;
    private var COLORS:Array = [0xff7729, 0x1ab58a, 0xffebca, 0xff2151, 0xffad29];

    private var _shape:Shape = new Shape();
    private var _graphics:Graphics = _shape.graphics;
    private var _bmpData:BitmapData;
    private var _image:Image;

    public function Circle()
    {
        shuffle();
        init();
        draw();
    }

    private function shuffle():void {
        this._radius = Math.floor(Math.random() * this.MAX_RADIUS) + this.MIN_RADIUS;
        this._color = this.COLORS[Math.floor(Math.random() * this.COLORS.length)];
        this._speed = Math.floor(Math.random() * this.MAX_SPEED) + this.MIN_SPEED;
        this._x = Math.floor(Math.random() * Starling.current.nativeStage.stageWidth);
        this._y = Math.floor(Math.random() * Starling.current.nativeStage.stageHeight) - Starling.current.nativeStage.stageHeight;
    }

    private function init():void {
        this._graphics.clear();
        this._graphics.beginFill(this._color, 1);
        this._graphics.drawCircle(this._radius, this._radius, this._radius);
        this._graphics.endFill();

        this._bmpData = new BitmapData(this._radius*2, this._radius*2, true, 0x000000);
        this._bmpData.draw(this._shape);

        this._image = Image.fromBitmap(new Bitmap(this._bmpData, "auto", true));
        addChild(this._image);
    }

    private function draw():void {
        this._image.x = this._x;
        this._image.y = this._y;        
    }

    public function update():void {
        this._image.x = this._x;
        this._image.y += this._speed;
        if (this._image.y > Starling.current.nativeStage.stageHeight) {
            shuffle();
            draw();
        }
    }
  private var particles:Array = [];
  private var speeds:Array = [];

 private var MAX_SPEED = 10;
 private var MIN_SPEED = 1;

private var filter0:ColorMatrixFilter = new ColorMatrixFilter();
private var filter1:ColorMatrixFilter = new ColorMatrixFilter();
private var filter2:ColorMatrixFilter = new ColorMatrixFilter();
private var filter3:ColorMatrixFilter = new ColorMatrixFilter();
private var filter4:ColorMatrixFilter = new ColorMatrixFilter();
private var COLORS:Array = [filter0, filter1, filter2, filter3, filter4];


 // Embed the texture:
 [Embed(source="circle.png")]    //<---- EMBED A CRICLE PNG
  public static const Circle:Class;

public function Particle()
{
    addEventListener(Event.ADDED_TO_STAGE, init);
}

var texture:Texture = Texture.fromBitmap(new Circle());
private function init(event:Event):void {
    filterRed.tint(0xff7729, 1);
    filterRed.tint(0x1ab58a, 1);
    filterRed.tint(0xffebca, 1);
    filterRed.tint(0xff2151, 1);
    filterRed.tint(0xffad29, 1);

    for (var i:int=0;i<200;i++) {
        particles[i] = new Image(texture);

        shuffle(i);


        addChild(particles[i]);
    }

    addEventListener(Event.ENTER_FRAME, update);
}

private function update(event:Event):void {
    for (var i:int=0;i<particles.length;i++) {
        update(i);
    }
}

public function update(imageID:int):void {
    particles[imageID].x = x;
    particles[imageID].y += speeds[imageID];
    if (_image.y > Starling.current.nativeStage.stageHeight) {
        shuffle(i);
    }
}

public function shuffle(i:int):void {
    particles[i].scaleX = particles[i].scaleY = Math.floor(Math.random() * this.MAX_RADIUS/particles[i].width) + this.MIN_RADIUS/particles[i].width;
    particles[i].filter = this.COLORS[Math.floor(Math.random() * this.COLORS.length)];
    speeds[i] = Math.floor(Math.random() * this.MAX_SPEED) + this.MIN_SPEED;
    particles[i]._x = Math.floor(Math.random() * Starling.current.nativeStage.stageWidth);
    particles[i]._y = Math.floor(Math.random() * Starling.current.nativeStage.stageHeight) - Starling.current.nativeStage.stageHeight;
}