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行代码是从精灵帧缓存中通过精灵帧名创建精灵对象。
实例
Cocos2d-JS 精灵的性能优化_第1张图片 Cocos2d-JS 精灵的性能优化_第2张图片
上述代码第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函数是退出时回调的函数,与构造函数类似,都属于层的声明周期中的函数。



你可能感兴趣的:(使用纹理图集,使用精灵帧缓存,精灵的性能优化)