對於一個只在大學期間學習了JavaScript，實習期間學習了點HTML、CSS的菜鳥，做游戲對我而言是一件想都不敢想的事情，后有幸被公司安排參與一款HTML5游戲的開發，才使我真正第一次與游戲來了次親密接觸。
這次開發的游戲，界面布局比較復雜，子界面也比較多，在開發的時候並沒有考慮太多，只是想着快些把游戲效果做出來，快些看到游戲效果，結果踩了很多坑，當然也有不少收獲：
- 圖集的妙用：圖集是將一些零散的圖片資源整合到一張大的圖片中，方便在項目中管理圖片資源。
比如，如果在游戲中，有兩個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來設計，即使你在游戲布局中節點偏移值設置死了，界面的布局也不會存在錯位問題。
以上就是我的心得，當然，作為一個菜鳥肯定有些地方說的不夠全面或者不對的地方，希望大家可以提一些意見，多多交流一下，后續我也會繼續分享我的游戲開發心得，讓后來的學弟學妹少踩坑，也是自我的不斷學習。