一个菜鸟程序员的游戏开发心得

 

    对于一个只在大学期间学习了JavaScript，实习期间学习了点HTML、CSS的菜鸟，做游戏对我而言是一件想都不敢想的事情，后有幸被公司安排参与一款HTML5游戏的开发，才使我真正第一次与游戏来了次亲密接触。

    这次开发的游戏，界面布局比较复杂，子界面也比较多，在开发的时候并没有考虑太多，只是想着快些把游戏效果做出来，快些看到游戏效果，结果踩了很多坑，当然也有不少收获：

 

1. 图集的妙用：图集是将一些零散的图片资源整合到一张大的图片中，方便在项目中管理图片资源。

比如，如果在游戏中，有两个UIImage节点，并且两个节点的图片资源是分散的，这时候要通过代码来设置两个节点的图片资源的话，就必须通过game.assets.load()方法来一部加载图片，载到图片后在设置到对应的节点上；但是如果将图片资源打包成图集的话，要用到图片资源的节点都引用这个图集资源，需要改变显示图片的话，就只需要image.frame = ‘imageName.png’就可以了，这样即减少了服务器请求次数，也缩短了新资源的显示时间。

 

      图集还有一个一个妙处就是可以增强游戏绘制性能，在WebGL渲染方式下，图集的使用可以减少绘制时图集的频繁切换，形成批量绘制，让游戏表现更流畅。但是要达到批量绘制的效果的话，UIImage节点就需要尽可能的排布在一起，为什么这么说呢，在游戏中少不了有文字的存在，如果在一堆的UIImage节点中添加了一个UIText节点的话，批量绘制就会被中断，所以节点找对组织很重要，找错了，性能就有可能大大的受影响。

 

      上面提到的批量绘制也就在WebGL渲染方式下起效，但是目前移动端设备上的浏览器对WebGL的支持参差不齐，存在不少的问题，因此游戏发布并不建议使用WebGL的渲染方式。建议使用Canvas的渲染方式发布，我使用的青瓷引擎目前对Canvas的支持做了不少的优化，在浏览器适配上花了很大的功夫。

 

      2. 页面缓存：部分节点由很多部分组合而成，而且每个组合部分，很少变动。如果将节点缓存为一张图片，那么可以减少绘制，提升性能。有鉴于此，提供了qc.CacheAsBitmap功能，将节点缓存为图片。具体使用及介绍可以参考：http://docs.zuoyouxi.com/manual/BuildinComponents/CacheAsBitmap.html

     页面的缓存并不是用的越多越好，因为缓存是占内存的，用多了，内存有可能会hold不住；还有一点是变化比较频繁的节点也不适合使用缓存机制。

 

     3. 屏幕自适应：在游戏开发中，分辨率适配问题是一个比较头疼的问题，青瓷引擎提供了一套成熟的解决方案，让你不再为分辨率适配问题头疼。由于比较复杂，我在这里就不详细介绍了，具体可以参考：http://docs.zuoyouxi.com/manual/UI/AdapterResolution.html

 

      屏幕自适应的好处在于，设置了适合自己游戏的显示类型后，整个游戏就可以根据选择的类型做一些绝对坐标的布局 ，比如，manualType选择了Expend，referenceResolution设置了960*640的分辨率，那么整个游戏界面的坐标布局设计都可以根据960*640来设计，即使你在游戏布局中节点偏移值设置死了，界面的布局也不会存在错位问题。

 

     以上就是我的心得，当然，作为一个菜鸟肯定有些地方说的不够全面或者不对的地方，希望大家可以提一些意见，多多交流一下，后续我也会继续分享我的游戏开发心得，让后来的学弟学妹少踩坑，也是自我的不断学习。