Cocos 2d性能优化

缓存池pool

每次创建一个新的精灵都会带来一定消耗，如果把之前删除的精灵回收到缓存池，下次创建精灵时重复利用则省去这部分消耗。

var sushi=cc.Sprite.extend(
{
    ctor:function(){}   
    reuse:function(){},
 	unuse :function(){}
});
判断cc.pool是否有某个类
cc.pool.hasObject(TargetClass)
放入和获取
cc.pool.putInPool(instance)
cc.pool.getFromPool(PoolSprite)

优化实例
this.removeFromParent();
cc.pool.putInPool(this);
在移除的时候，加入缓冲池

var Sushi = cc.Sprite.extend({
    _animation:null,
    ctor: function () {
        this._super("#sushi_1n.png");
    },
    blink: function () {
        cc.spriteFrameCache.addSpriteFrames(res.sushiPlist);

        // 动画配置，帧与时间
        this._animation = new cc.Animation();
        var name = '';
        for (var i = 0; i < 9; i++) {
            name = "sushi_1n_" + i + ".png";
            this._animation.addSpriteFrame(
                cc.spriteFrameCache.getSpriteFrame(name)
            );
        };
        this._animation.setDelayPerUnit(1 / 20);
        //生成 action
        this.stopAllActions();
        var action1 = cc.animate(this._animation).repeat(1);
        //函数动画
        var action2 = cc.callFunc(function () {
            this.removeFromParent();
            cc.pool.putInPool(this);
            //激活得分事件
            var event = new cc.EventCustom("GETSCORE");
            var data = { score: 100 };
            event.setUserData(data);

            cc.eventManager.dispatchEvent(event);

        }.bind(this));
        var sequence = cc.sequence(action1, action2)
        this.runAction(sequence);

        
    },
    reuse: function () {
        this.setTexture("#sushi_1n.png");
        console.log("reuse");
    },
    unuse: function () {
        this.stopAllActions();
        console.log("unuse");
    }

});

Sushi.create = function () {
    if (cc.pool.hasObject(Sushi)) {
        return cc.pool.getFromPool(Sushi);
    } else
        return new Sushi();
}

批量渲染SpriteBatchNode

使用环境：绘制方式为webGl有效，canvas方式无效
Project.json配置：“renderMode”: 0

var batchNode = new cc.SpriteBatchNode(res.candyPng);
this.addChild(batchNode)
batchNode.addChild(ball);

示例代码

var SpriteBatchScene = cc.Scene.extend({
    ctor: function () {
        this._super();
        var size = cc.director.getWinSize();
        cc.spriteFrameCache.addSpriteFrames(res.candyPlist);
        this.addSprite2();
       
    },
    addSprite: function () {
        for (var i = 0; i < 4000; i++) {
            var sprite = new cc.Sprite("res/coin/coin.png");
            var size = cc.director.getWinSize();
            sprite.x = size.width * cc.random0To1();
            sprite.y = size.height * cc.random0To1();
            var action = new cc.RotateBy(1, 360 * cc.random0To1(), 360 * cc.random0To1()).repeatForever();
            sprite.runAction(action);
            this.addChild(sprite);
        }
        
    },
    addSprite2: function () {
        var size = cc.director.getWinSize();
        var batchNode = new cc.SpriteBatchNode(res.candyPng);
        this.addChild(batchNode)

        for (var i = 0; i < 4000; i++) {
            var sprite = new cc.Sprite("#" +( Math.floor(5 * cc.random0To1())+1) + ".png");
            batchNode.addChild(sprite);
            
            sprite.x = size.width * cc.random0To1();
            sprite.y = size.height * cc.random0To1();
            var action = new cc.RotateBy(1, 360 * cc.random0To1(), 360 * cc.random0To1()).repeatForever();
            sprite.runAction(action);        
        }
    }
})

烘焙层bake

有些游戏关卡，为了节省资源，通常会采用一些解决背景图片加配置装饰物的方式生产背景效果，其自身和子节点在创建完毕后，就很少发生例如：添加、删除、运动等，cocos-2d-为其定制渲染优化机制-图层预烘焙

图层预烘焙优化得益于cc.Layer 最加的bake函数，一个调用bake函数的层会将其自身以及所有的子节点烘焙到一张画布(canvas),只要自身以及所有子节点不发生例如添加或删除子节点，以及运行动作等变动行为，那么在下一帧绘制时，引擎会将预烘焙到画布上内容直接绘制出来。

使用环境：绘制方式为canvas，webGL方式无效
Project.json配置：“renderMode”: 1,

var layer = new cc.Layer();
layer.bake();

var BakeScene = cc.Scene.extend({
    ctor: function () {
        this._super();
        this.addBG();
    },
    addBG: function () {
        var layer = new cc.Layer();
        this.addChild(layer);
        for (var i = 0; i < 4000; i++) {
            var sprite = new cc.Sprite("res/coin/coin.png");
            var size = cc.director.getWinSize();
            sprite.x = size.width * cc.random0To1();
            sprite.y = size.height * cc.random0To1();
            layer.addChild(sprite);
        }
        layer.bake();
    }
})