2018年基于Cocos的高性能跨平臺開發方案.pdf

《2018年基于Cocos的高性能跨平臺開發方案.pdf》由會員分享，可在線閱讀，更多相關《2018年基于Cocos的高性能跨平臺開發方案.pdf（53頁珍藏版）》請在三個皮匠報告上搜索。

1、基于Cocos的高性能跨平臺開發方案項目背景體會和實踐效果對比123項目背景體會和實踐效果對比123ABCmouse美國銷量第一幼教App團隊開發，全美國7萬教師推薦使用ABCmouseABCmouse 采用典型的 Hybrid App 跨平臺解決方案Hybrid APP 性能問題loading，又在loadingABCmouse 各場景加載耗時3.72.43.52.32.92.300.511.522.533.54原版啟動耗時(s)ArtPuzzleGamesMusicVideosSongs and ChantsListening LibraryABCmouse 騰訊版針對中國兒童精心制作煥然

2、一新的界面設計更符合中國兒童使用習慣的學習路徑強化的社交分享能力技術目標性能效率表現力社交技術選型：Cocos跨平臺性能效率表現力我們選擇使用Cocos改造ABCmouse項目背景體會和實踐效果對比123體會和實踐架構篇甜頭篇踩坑篇優化篇架構篇客戶端架構通用通用UI組件組件音音頻播放頻播放圖片加載圖片加載常常駐節點管理器駐節點管理器上上報報日志日志webview視頻播放視頻播放音音頻播放頻播放callStaticMethodevalString支付支付賬號體系賬號體系安全安全上上報報日志日志推送推送社交社交錄音錄音VAD場景場景Creator 組件組件彈窗調度器彈窗調度器Cocos2d-x J

3、S BindingsCocos2d-xScript Engine WrapperJavaScriptCoreSpiderMonkeyV8ChakraCoreCocos 層Native 層跨平臺原理 VS React NativeUI Threadscripts/fireGLThreadGLCocos2d-xScene TreeJS(JSX)Virtual DOMAndroidiOSBrowserReact NativeCocos甜頭篇甜頭1：跨平臺一周搞定小游戲版本甜頭2：高效開發Cocos Creator：基于 Cocos2d-x，組件化，腳本化，數據驅動，跨平臺發布甜頭2：高效開發Coco

4、s Creator 支持直接在瀏覽器中預覽調試場景，省去構建編譯的耗時。甜頭3：熱更新靈活同時支持腳本和資源的更新；無需重啟，直接 reload；支持自定義熱更新方案；支持增量更新、斷點續傳、文件校驗、失敗重試和跳過甜頭4：強大的社區支持和市場占有率踩坑篇坑1：需要自己開發一些UI組件坑2：UI 節點需要注意調度沒有調度有調度坑3：VideoPlayer 視頻置頂問題Cocos 的 GLSurfaceView 不能直接支持渲染視頻，因此，Cocos 提供了VideoPlayer 組件用于播放視頻。VideoPlayer 是獨立且置頂的一層。問題：無法在視頻上繪制UI。GLSurfaceView

5、VideoPlayer（fix top）坑3：VideoPlayer 視頻置頂問題解決方案：改用自定義的 Native 視頻播放器。GLSurfaceView自定義 VideoPlayer（fix top）坑4：AudioEngine 不支持 native 端遠程音頻播放開發一個跨平臺音頻播放器，支持多端播放遠程/本地音頻。A/art:art/runtime/indirect_reference_table.cc:138 JNI ERROR(app bug):local reference table overflow(max=512)A/art:art/runtime/indirect_re

6、ference_table.cc:138 local reference table dump:A/art:art/runtime/indirect_reference_table.cc:138 Last 10 entries(of 512):A/art:art/runtime/indirect_reference_table.cc:138 511:0 x12e45170 java.lang.String A/art:art/runtime/indirect_reference_table.cc:138 510:0 x12dd33c0 java.lang.ClassA/art:art/runt

7、ime/indirect_reference_table.cc:138 509:0 x12e45180 java.lang.String A/art:art/runtime/indirect_reference_table.cc:138 508:0 x12f89490 java.lang.String 59A/art:art/runtime/indirect_reference_table.cc:138 507:0 x135a4f40 java.lang.String 1522668817662A/art:art/runtime/indirect_reference_table.cc:138

8、506:0 x12e89400 java.lang.String onLoadA/art:art/runtime/indirect_reference_table.cc:138 505:0 x12e451d0 java.lang.String A/art:art/runtime/indirect_reference_table.cc:138 504:0 x12c8bc00 java.lang.Class 3)if(call.isValid()&call.getArgumentsCount()=(argc-3)for(int i=0;i NewStringUTF(str.c_str();brea

9、k;ok=call.executeWithArgs(jargs);if(jargs)delete jargs;沒有釋放！JavaScriptJavaBridge.cpp坑5：Local Reference Table Overflow Error 問題提交修復 Pull Request（#1178）優化篇?ScrollView 優化解決方案：官方 ScrollView 組件會一次加載全部的子節點組件，當子節點過多時，會導致渲染掉幀，內存消耗高。ScrollView 優化優化思路：滾動過程回收不可視的子節點組件并重用?？梢晠^域ScrollView 優化優化思路：滾動過程回收不可視的子節點組件并重

10、用?？梢晠^域ScrollView 優化效果：穩定在 60 fps 左右內存占用優化優化前：內存占用過高，引發強制GC導致黑屏或OOM。待補充內存占用優化優化思路一：繪制內存監視器，找出消耗大的元兇待補充totalBytes+=selTexture.getPixelWidth()*selTexture.getPixelHeight()*(url&url.indexOf(.jpg)0?3:4);內存占用優化優化思路一：繪制內存監視器，找出消耗大的元兇內存占用優化優化思路二：使用紋理壓縮兼容性大多數設備質量差內存消耗：0.5 bppiOS低端設備兼容差質量較差內存消耗：0.5 bpp低端設備兼容差質

11、量較好內存消耗：1 bpp內存占用優化PVR/ETC2 效果對比16mb原圖ETC2PVR4mb2mb內存占用優化混合紋理壓縮方法，單圖內存消耗降低接近75%87.5%。輸入待壓縮紋理高質量要求紋理低質量要求紋理紋理歸類ETC2紋理大小減半紋理PVR紋理輸出內存占用優化增量混合紋理壓縮工具（即將開源）優化方法耗時（s）無優化180增量壓縮10drawcall 優化CPU將渲染指令傳遞給GPU的過程為一次drawcall。通過降低drawcall，提升性能。SceneNodeSpriteSprite場景樹渲染隊列GPUDraw call#1Draw call#2Draw call#3貼圖A渲染指

12、令#1貼圖A渲染指令#2貼圖B渲染指令#3貼圖B渲染指令#4貼圖C渲染指令#5貼圖C渲染指令#6貼圖C渲染指令#7drawcall 優化分析：deactive 節點手段：batching 靜態 Sprite：合并圖集 Label：BMFont 位圖字體局限：動態資源、動畫drawcall 優化：避免跨層切換貼圖SceneNodeSpriteSprite場景樹渲染隊列GPUDraw call#1Draw call#2Draw call#5貼圖A渲染指令#1貼圖A渲染指令#2貼圖B渲染指令#3貼圖B渲染指令#4貼圖C渲染指令#5貼圖C渲染指令#6貼圖C渲染指令#7Draw call#3Draw c

13、all#4Hybrid 頁面優化對未改造的 H5 頁面進行一系列優化，達到首屏直出的要求。直出動靜分離、增量更新緩存并行加載、預加載Hybrid 頁面優化效果對比優化前(ms)優化后(ms)我的房間1522688688倉鼠2004870870魚缸1944850850游戲 Hello:Ballon Popper2037987987游戲 I Can Do This1792713713游戲 My Clothes MatchingCards1821739739游戲 Magic RainbowPainter1853741741游戲 Lots of Leaves1588685685游戲 This is M

14、y Face1323572572游戲 Family:Memory Match1421692692項目背景體會和實踐效果對比123整體Cocos化率15%24%40%4%8%9%ArtPuzzleGamesMusicVideosSongsandChantsListeningLibraryCocos：56%H5：40%Native：4%啟動速度對比3.70.82.40.53.50.92.30.52.90.62.30.500.511.522.533.54原版騰訊版啟動耗時(s)ArtPuzzleGamesMusicVideosSongs and ChantsListening Library啟動速度對比：畫圖待補充待補充包大小對比415.3 MB85.8 MB包大小減小79.3%。