Cocos 微信小游戲內(nèi)存與性能優(yōu)化指南（iOS端）

由于微信小游戲普通模式是基于 C++ 渲染層與 JS 編譯引擎在原生平臺(tái)模擬 HTMLCanvas 渲染能力的方案，其中 JS 代碼的編譯執(zhí)行效率會(huì)極大影響游戲運(yùn)行的性能。通常 JS 引擎都提供了 JIT 能力用于提高編譯速度，這使得小游戲能夠在 Android 端取得優(yōu)異的性能。但是在 IOS 端由于系統(tǒng)安全策略限制 JS 引擎使用 JIT 功能，導(dǎo)致小游戲在 iOS 端的性能一直差強(qiáng)人意。

微信小游戲提供的高性能模式，通過(guò)轉(zhuǎn)用微信內(nèi)部的 Webkit 運(yùn)行游戲的方式，使得在 iOS 上的小游戲，也能擁有 JIT 能力，大幅度提升運(yùn)行性能。

從微信小游戲官方文檔的水族館測(cè)試中，我們可以看到，同樣的場(chǎng)景，在 iPhone11 Pro Max 上，高性能模式下達(dá)到了 49 FPS，普通模式下卻只有 13 FPS。

本文將從以下四個(gè)方面進(jìn)行講解：

• 高性能模式
• 運(yùn)行時(shí)內(nèi)存結(jié)構(gòu)
• 內(nèi)存問(wèn)題診斷
• 內(nèi)存優(yōu)化技巧

因?yàn)閮?nèi)存問(wèn)題在 Android 端表現(xiàn)良好，在 iOS 端反饋較多，所以本文僅對(duì) iOS 端內(nèi)存優(yōu)化做介紹。

有關(guān)高性能模式的介紹以及使用方法請(qǐng)?jiān)敿?xì)閱讀微信小游戲開(kāi)發(fā)文檔：高性能模式（可長(zhǎng)按文末二維碼）。

開(kāi)通方式

1. 登錄微信公眾平臺(tái) -> 首頁(yè)能力地圖模塊 -> 點(diǎn)擊進(jìn)入"生產(chǎn)提效包" -> 點(diǎn)擊開(kāi)通高性能模式。
2. 開(kāi)通成功后，通過(guò)配置 game.json 的 iOSHighPerformance 為 true 則可進(jìn)入高性能模式。
3. Cocos Creator 3.7 之后，可以直接在項(xiàng)目->構(gòu)建發(fā)布面板上勾選高性能模式。
   

通過(guò)去掉此開(kāi)關(guān)可以正常回退到普通模式，以便兩種模式對(duì)比。

注意問(wèn)題

1. 高性能模式下，游戲?qū)碛懈玫匿秩拘阅芎捅憩F(xiàn)，但是它對(duì)游戲的內(nèi)存要求更加嚴(yán)格。

2. 在高性能模式下，小游戲運(yùn)行于瀏覽器內(nèi)核環(huán)境，所以兼容性、內(nèi)存消耗、穩(wěn)定性等方面需要單獨(dú)進(jìn)行測(cè)試，不能復(fù)用普通模式的測(cè)試結(jié)果。

3. 在 iOS 設(shè)備中， iphone 6s/7/8 等 2G RAM 機(jī)型的內(nèi)存限制為 1G，iphone 7P/8P/iPhoneX/XR/XSAMX/11 等 3G RAM 機(jī)型的內(nèi)存限制為 1.4G，一旦應(yīng)用程序的內(nèi)存占用超過(guò)這個(gè)閥值，就會(huì)被系統(tǒng)殺掉進(jìn)程。因此開(kāi)發(fā)者務(wù)必保證內(nèi)存峰值不超過(guò)該數(shù)值。

4. 如果游戲沒(méi)做好內(nèi)存優(yōu)化，不建議開(kāi)啟高性能模式，否則在 iOS 低端機(jī)容易出現(xiàn)內(nèi)存異常退出的情況，如有內(nèi)存問(wèn)題，可參考本文的內(nèi)存優(yōu)化技巧，充分優(yōu)化內(nèi)存。

從上圖中可以看到，運(yùn)行時(shí)內(nèi)存一共由 6 個(gè)部分組成。

JavaScript Heap

在高性能模式下，小游戲運(yùn)行于瀏覽器內(nèi)核環(huán)境，因此 JavaScript Heap 包含游戲邏輯代碼內(nèi)存。通常我們可以打包 web-mobile 端，使用 Mac 平臺(tái)的 Safari 瀏覽器的調(diào)試工具來(lái)遠(yuǎn)程調(diào)試手機(jī) safari 的內(nèi)存情況。需要注意的是 JavaScript Heap 通常無(wú)法看出具體物理內(nèi)存使用。

WASM 資源

為了提高 JS 模塊的執(zhí)行性能，比如物理引擎的計(jì)算，我們會(huì)將一些 C++ 代碼直接編譯成 WASM 代碼片段來(lái)達(dá)到優(yōu)化性能的需求。比如 Cocos Creator 部分引用的第三方物理庫(kù)就是 WASM 版本。

基礎(chǔ)庫(kù)和 Canvas

基礎(chǔ)庫(kù)可以理解為微信小游戲的黑盒環(huán)境暴露的 API 封裝，可以防止將瀏覽器內(nèi)核環(huán)境 API 暴露給開(kāi)發(fā)者，實(shí)際測(cè)試基礎(chǔ)庫(kù)內(nèi)存占用在 70M 左右。小游戲環(huán)境第一個(gè)創(chuàng)建的 Canvas 是主 Canvas，也是唯一可以將渲染表面同步到主界面的 Canvas，即呈現(xiàn)我們游戲的渲染表現(xiàn)。Canvas 的內(nèi)存占用跟 Canvas 的寬高大小成正比。

音頻文件

音頻文件內(nèi)存是指加載到內(nèi)存的音頻實(shí)例。

GPU 資源

比如頂點(diǎn)數(shù)據(jù)緩存，索引數(shù)據(jù)緩存，紋理緩存和渲染表面緩存等等。

下面給大家介紹一些常用的 iOS 內(nèi)存診斷工具，它們可以輔助我們快速定位內(nèi)存問(wèn)題，找出解決辦法。

常用 iOS 設(shè)備內(nèi)存查看工具

• Xcode 自帶的 Instrument 分析工具
• Perfdog 工具
• 微信開(kāi)發(fā)者工具

注意：iOS 端小游戲的進(jìn)程名稱在不同模式下有區(qū)別。

• 高性能模式：含有 WebContent
• 普通模式：含有 WeChat

XCode Instruments

XCode Instruments 是 XCode 自帶的應(yīng)用程序運(yùn)行時(shí)分析工具，它同樣適用于微信小游戲進(jìn)程。

使用 Activity Monitor，選擇對(duì)應(yīng)的設(shè)備 all processes 捕捉，等進(jìn)程列表刷新后，輸入 webkit 進(jìn)行過(guò)濾，即可看到所有進(jìn)程的 CPU 與內(nèi)存情況.

Perfdog

Perfdog（性能狗）是一個(gè) iOS/Android/PC/主機(jī)平臺(tái)的性能測(cè)試和分析工具，具體使用方式請(qǐng)參考: https://perfdog.qq.com/

選擇對(duì)應(yīng)的設(shè)置-進(jìn)程名，即可看到相關(guān)性能數(shù)據(jù)。

可以參考【開(kāi)發(fā)階段內(nèi)存調(diào)優(yōu)：把一切都控制在最開(kāi)始 | 微信開(kāi)放文檔】: https://developers.weixin.qq.com/minigame/dev/guide/performance/perf-action-memory-dev-profile.html

微信開(kāi)發(fā)者工具

微信開(kāi)發(fā)者工具主要使用它的調(diào)試器來(lái)跟蹤內(nèi)存數(shù)據(jù)，操作流程如下：

1. 進(jìn)入調(diào)試開(kāi)發(fā)者工具界面
2. 將 【Memory】勾選，然后刷新游戲
3. 點(diǎn)擊下圖左上角的小圓圈按鈕開(kāi)始錄制
4. 結(jié)束錄制后，就會(huì)顯示下圖界面

我們主要關(guān)注兩個(gè)波形圖，一個(gè)是 Main 波形圖，用于查看邏輯幀調(diào)用棧，一個(gè)是 JS Heap 的峰值曲線，用于觀察內(nèi)存增長(zhǎng)變化。如果我們觀察到某個(gè)時(shí)刻 JS Heap 值增加，然后我們就可以查看邏輯幀調(diào)用棧大概確認(rèn)數(shù)據(jù)來(lái)源。

通過(guò)上述步驟可以分析出游戲的 JS 內(nèi)存分布，然后當(dāng)我們要確定某塊 JS 內(nèi)存的來(lái)源與釋放情況，就需要用到下面的內(nèi)存泄漏檢測(cè)工具 - 實(shí)時(shí)內(nèi)存診斷。

具體操作步驟如下：

1. 點(diǎn)擊左上角的小圓圈按鈕，會(huì)進(jìn)入下面的錄制按鈕，柱狀圖的出現(xiàn)表示某個(gè)內(nèi)存塊的創(chuàng)建，消失標(biāo)識(shí)內(nèi)存塊被釋放。左上角的垃圾桶按鈕是主動(dòng)觸發(fā) JS引擎的 GC 的按鈕，點(diǎn)擊后可以加快內(nèi)存回收速度。

2. 再次點(diǎn)擊左上角的紅色小圓圈按鈕結(jié)束錄制，這時(shí)候我們可以選中藍(lán)色區(qū)域，然后會(huì)顯示該內(nèi)存塊包含的對(duì)象，這些是在內(nèi)存中未被釋放的資源，選中某個(gè)對(duì)象后，可以在 Retainers 界面看到對(duì)象的內(nèi)存引用關(guān)系。到這里你可以根據(jù)代碼層的邏輯關(guān)系來(lái)推理內(nèi)存對(duì)象是否應(yīng)該被釋放，從而確認(rèn)是否內(nèi)存泄露。

常見(jiàn)微信小游戲項(xiàng)目的內(nèi)存由下面幾個(gè)部分組成：

1. 小游戲基礎(chǔ)庫(kù)
2. 引擎腳本內(nèi)存
3. 業(yè)務(wù)腳本內(nèi)存
4. 音頻內(nèi)存
5. 字體內(nèi)存
6. 圖片內(nèi)存
7. Canvas 內(nèi)存

知道了內(nèi)存組成部分后，我們就可以針對(duì)不同的部分做一些優(yōu)化。

以 iOS 高性能模式為例，常用的內(nèi)存優(yōu)化技巧如下：

1. 小游戲通常基礎(chǔ)庫(kù)的內(nèi)存 ~= 70M，常駐內(nèi)存，不可優(yōu)化。

2. 引擎內(nèi)存占用加載是確定的，由于引擎加載會(huì)初始化渲染器，所以通常主 Canvas 內(nèi)存占用也在這個(gè)時(shí)候確定，這塊內(nèi)存占用可以通過(guò)配置渲染分辨率的倍數(shù)來(lái)優(yōu)化。運(yùn)行時(shí)根據(jù)引擎模塊需要，會(huì)動(dòng)態(tài)增加一些緩存內(nèi)存，開(kāi)發(fā)者可以根據(jù)功能需要通過(guò)編輯器項(xiàng)目設(shè)置里面的功能裁剪來(lái)減少引擎內(nèi)存占用。

3. 腳本內(nèi)存包含引擎和業(yè)務(wù)代碼、配置表數(shù)據(jù), 根據(jù)游戲的開(kāi)發(fā)體量，業(yè)務(wù)代碼和配置表數(shù)據(jù)內(nèi)存會(huì)有幾百M(fèi)的大小，只能用戶自己做優(yōu)化。

4. 單個(gè)雙通道的音頻實(shí)例可能在 20M 左右，音頻播放完后做釋放會(huì)減少這塊內(nèi)存損耗，也可以精簡(jiǎn)成單通道音頻減少內(nèi)存。

5. 在國(guó)內(nèi)，一般使用的是中文字體，加載后內(nèi)存占用至少大于 10M，所以盡量使用系統(tǒng)字，使用應(yīng)用內(nèi)部的共享資源。如果開(kāi)發(fā)條件允許的情況下，可以使用 Bitmap 字體和 SDF 字體渲染。

6. 圖片內(nèi)存是常用資源，根據(jù)加載需要，可以選擇填充紋理后釋放，或者緩存于內(nèi)存中以便下次重新填充紋理。在iOS端上建議使用 astc 壓縮紋理格式，同時(shí)禁用動(dòng)態(tài)合批，這樣可以釋放 image 資源內(nèi)存。壓縮紋理本身也比 png 的內(nèi)存占用小超過(guò)50%，但是 astc 的文件大小會(huì)比 png 大，所以會(huì)增加包體大小。通常為了減少首包大小，盡量將圖片資源放到小游戲分包或者遠(yuǎn)程分包。

7. TTF 字體文本渲染時(shí)會(huì)創(chuàng)建 Canvas 對(duì)象，Canvas 對(duì)象使用完會(huì)被回收到緩存池中，文本渲染的字號(hào)越多， 緩存池就越大，目前引擎沒(méi)有提供回收機(jī)制，必要時(shí)可以修改引擎來(lái)釋放 Canvas 緩存池。如果游戲運(yùn)行內(nèi)存占用比較高，可以使用 Bitmap 字體替代 TTF 字體。

8. 還有其他的 JS 內(nèi)存對(duì)象，比如 JSON 文件的釋放，根據(jù)引擎提供的能力按需釋放。

本文由 Cocos 引擎官方技術(shù)支持團(tuán)隊(duì) 提供，已同步到引擎官方開(kāi)源倉(cāng)庫(kù)中：微信小游戲內(nèi)存優(yōu)化指南（IOS 端），歡迎大家 Star、Fork。