Cocos2d-JS 精灵的性能优化

1.使用纹理图集

纹理图集已称为精灵表，它是把许多小的精灵图片组合到一张大图里面，使用纹理图集（或精灵表）有如下主要优点：

（1）减少文件读取次数，读取一张图片比读取一堆小文件要快

（2）减少渲染引擎的绘制调用并且加速渲染

（3）Cocos2d-JS全面支持Zwoptex和TexturePacker，所以创建和使用纹理图集是很容易的。

通常使用纹理图集制作工具Zwoptex和TexturePacker，所以创建和使用纹理图集是很容易的

2.使用精灵帧缓存

精灵帧缓存是缓存的一种。缓存有如下几种：

（1）纹理缓存。使用纹理缓存可以创建纹理对象

（2）精灵帧缓存。能够从精灵表中创建精灵帧缓存，然后再从精灵帧缓存中获得精灵对象，反复使用精灵对象时，使用精灵帧缓存可以节省内存消耗。

（3）动画缓存，动画缓存主要用于精灵动画，精灵动画中的每一帧都是从动画缓存中获取的。

使用SpriteFrameCache创建精灵对象的主要代码如下：

1    var frameCache=cc.spriteFrameCache

2    frameCache.addSpriteFrames(“res/SpriteSheet.plist”,”res/SpriteSheet.png”)

3    var mountain1=new cc.Sprite(“#mountain1.png”)

上述代码第1，2行是向精灵帧缓存中添加精灵帧，其中第一个参数是SpriteSheet.plist是坐标文件，第二个参数SpriteSheet.png是纹理图集文件。第3行代码是从精灵帧缓存中通过精灵帧名创建精灵对象。

实例

上述代码第1行是创建一个背景精灵对象，这个背景精灵对象并不是通过精灵缓存创建的，而是通过精灵文件直接创建的。

代码第3-4行是使用精灵帧缓存创建精灵对象的另外一种函数，其中第3行代码是使用精灵帧缓存对象frameCache的getSpriteFrame函数创建SpriteFrame对象，SpriteFrame对象就是“精灵帧”对象，事实上在精灵帧缓存中存放的都是这种类型的对象。第4行代码是通过精灵帧对象创建。

精灵帧缓存不再使用后要移除相关精灵帧，否认如果再有相同名称的精灵帧时，就会出现一些奇怪现象。spriteFrameCache类中移除精灵帧的缓存函数如下：

(1)removeSpriteByName(name)指定具体的精灵帧名移除

(2)removeSpriteFrames()指定移除精灵缓存

(3)removeSpriteFramesFromFile(url)指定具体的坐标文件移除精灵帧

(4)removeSpriteFramesFromTexture(texture)通过指定纹理移除精灵帧

为了防止该场景中的精灵帧对下一个场景产生影响，可以在当前场景所在层的onExit函数中调用这些函数。

onExit：function(){

this._super()

spriteFrameCache.removeSpriteFrames()

}

onExit函数是退出时回调的函数，与构造函数类似，都属于层的声明周期中的函数。