性能翻倍？！Cocos Creator 3.3 的小游戲升級優(yōu)化之路
開始正文先來個預(yù)告
Cocos 官方 Demo Team 成立以來，已經(jīng)發(fā)布了《奔跑吧巨人》和《奔跑吧小仙女》兩款 3D 小游戲。接下來，Demo Team 也將持續(xù)輸出各品類 3D 游戲，并提供含工程源碼、美術(shù)資源、策劃文檔的完整開源項目，同時邀請各路大神制作配套文字/視頻教程，敬請關(guān)注！
在《奔跑吧小仙女》發(fā)布后，有用戶反饋：“為什么 Demo 在微信小游戲平臺上，性能評測分?jǐn)?shù)總是不夠理想呢？”這是因為《奔跑吧小仙女》是基于 Cocos Creator 3.0 開發(fā)的，而在剛邁入 v3.0 時代時，發(fā)布到小游戲平臺的性能確實不怎么好。微信后臺的性能評測中，“啟動性能”的分?jǐn)?shù)尤其刺眼：
性能是小游戲的重中之重，v3.0 發(fā)布后的這大半年，引擎也在持續(xù)和性能“死磕”。Cocos Creator 3.3 認真對引擎性能做了一波優(yōu)化，特別是在小游戲平臺。拿升級到 v3.3 的《奔跑吧小仙女》跑跑看：
注意：該工程升級到 v3.3 后，水面因為 Shader 寫法升級的問題不能正常顯示，開發(fā)者可手動升級水面部分。
對比 v3.0 版本的數(shù)據(jù)，《奔跑吧小仙女》升級后，微信平臺的啟動性能分?jǐn)?shù)近乎翻倍，運行性能分?jǐn)?shù)提升了50%，各項指標(biāo)均達到令人滿意的程度?？梢钥闯觯?span style="box-sizing: border-box;">Cocos Creator 3.3 在小游戲的啟動性能、運行性能都有了一個顯著的提升。
除此之外，我們還對游戲做了其他優(yōu)化，在此也給出一些小游戲優(yōu)化上的流程和建議，供大家參考：
包體優(yōu)化
包體的大小直接影響游戲加載的時間，例如小游戲的首屏啟動時間等；而微信平臺對主包體的 4M 限制，也使得包體大小顯得非常關(guān)鍵。
引擎的功能裁切大家應(yīng)該都不陌生，在這里我們可以去掉項目不需要的模塊，有效減少包體大小。而到了 3D 時代，[物理系統(tǒng)]也和之前有些區(qū)別，此時可以根據(jù)項目需求選擇合適的物理引擎進行開發(fā)。
在小游戲平臺中，模型使用512x512尺寸的貼圖即可滿足基本需求。若游戲里使用了大量的資源圖片，也可以使用 tinyPNG、pngquant 等第三方平臺進行無損壓縮處理，適合自己的項目就好。
性能優(yōu)化
加載：在游戲未開始之前進行預(yù)加載，或加載完成后才可進入游戲。
震動：太過頻繁的震動也會產(chǎn)生卡頓。
粒子：小游戲平臺可根據(jù)手機性能適當(dāng)減少特效的展示。
重復(fù)節(jié)點：使用節(jié)點池。
音頻：查看代碼是否一次播放了多次重復(fù)音頻。
動畫：
較為簡單并重復(fù)執(zhí)行的動畫，例如游戲內(nèi)所有金幣旋轉(zhuǎn)，可以通過代碼實現(xiàn)；
3D 模型動畫，可以使用動畫預(yù)烘焙和 Joint Texture Layout 實現(xiàn)。
update：不同的功能，例如游戲內(nèi)的排名更新，可以間隔一定幀數(shù)，并分幀執(zhí)行。
update(){
const num = 5; //間隔num幀執(zhí)行一次方法
//director.getTotalFrames() 用于獲取 director 啟動以來游戲運行的總幀數(shù)
if (director.getTotalFrames() % num === 0) {
//執(zhí)行相應(yīng)操作 A
}
if (director.getTotalFrames() % num === 2) {
//執(zhí)行相應(yīng)操作 B
}
}
陰影：檢查所有模型 Mesh 的 ShadowCastingMode 以及 ReceiveShadow 狀態(tài)，關(guān)閉不需要的效果，例如地面可只接受陰影但不開啟陰影。
材質(zhì)：一些不需要光照的模型可以選擇不受光的材質(zhì)，例如游戲中的數(shù)字。
碰撞體：使用物體碰撞[分組和掩碼]、使用射線檢測時傳入距離參數(shù)、節(jié)省不必要的碰撞體使用，均能降低碰撞體的性能開銷。
合批：2D 界面可以使用工具提供的合圖功能。
文字：單獨放在最下面的節(jié)點，不打斷界面內(nèi)的合圖。并根據(jù)[Label 組件參考文檔]，按需求選擇文本緩存類型（Cache Mode）。
性能自查
如何通過工具查看性能問題？這邊以 Chrome 為例，打開開發(fā)者模式 -> Performance，介紹一下它的界面和使用說明。
首先點擊錄制按鈕，錄制一段性能視頻。若出現(xiàn)卡頓，則等待幾秒直至界面不卡頓再開始正常玩游戲，一般錄制10-30秒即可。
錄制結(jié)束后，查看時間軸上的 CPU（綠色區(qū)域），若幀數(shù)波動的部分有紅色提示，則代表此處出現(xiàn)卡頓問題，需要優(yōu)先解決。
若幀數(shù)波動的部分沒有紅色提示，可以分析并處理幀數(shù)不穩(wěn)的問題，如下圖中紅色下劃線標(biāo)出的部分。
那么，怎么查看具體是什么問題呢？選中并點擊一個幀數(shù)波動較大的區(qū)域，如下圖中的2號框，下方將顯示具體執(zhí)行了哪些代碼。再選擇 Call Tree -> Total Time，按耗時降序排列，打開耗時較多的部分查看具體原因，參考上述性能優(yōu)化方案做具體優(yōu)化。
資源鏈接
https://store.cocos.com/app/detail/3126
