如何選擇 H5 遊戲引擎

原生手遊市場已經是紅海，騰訊、網易等寡頭獨霸天下，H5遊戲市場或將成爲下一個風口。據筆者所知，不少H5遊戲開發團隊因爲選擇引擎不慎致使項目甚至團隊夭折。如何選擇適合團隊和項目的引擎，筆者經過學習和項目實踐，總結微薄經驗，供你們參考，非技術人員也能夠將本篇內容做爲引擎選擇的重要關注點。 選擇H5遊戲引擎的思考維度 一、開發語言的支持 二、2D、3D、VR的支持 三、性能 四、引擎的應用廣度 五、設計理念 六、工做流支持力度 七、商業化成熟案例 八、學習資源與技術支持能力 首先，咱們要知道，當前主流的遊戲引擎有哪些。因爲H5引擎有不少，筆者在這裏進行了精心的篩選，過濾掉不支持webGL的引擎，以及封裝了第三方渲染內核的JS框架，和不能直接在瀏覽器中運行的JS引擎。 爲何要過濾掉這幾種呢，首先，沒有本身的渲染內核，僅僅是基於第三方的內核做的API封裝，筆者很擔憂可持續的性能優化和維護能力。另外，不能在瀏覽器中直接運行的JS引擎，將限制H5遊戲跨平臺的交互能力。還有， 筆者很是看好webGL模式，認爲webGL模式纔是H5引擎的將來。緣由有幾點： 第1、性能，webGL模式遠超Canvas數倍。DOM模式就不適合用於真正的遊戲開發，更不用提。 第2、3D方向，webGL模式理論上能夠製做2D和3D遊戲，Canvas和DOM模式下只能製做2D遊戲。 第3、普及率，webGL的普及率已經很是高了，尤爲是支持webGL的騰訊TBS-Blink內核已在4月19日發佈，並逐步在微信、QQ空間、QQ瀏覽器、手機QQ等APP中採用靜默安裝方式全面升級。這個普及率在國內帶來的影響，;你懂的…… 一、選擇H5遊戲開發語言 擁有普遍開發者的H5遊戲開發語言共有三種，分別爲Flash AS三、TypeScript、JavaScript。其中Flash AS三、TypeScript均屬於面向對象的高級腳本語言，經過編譯器將原項目代碼編譯成JavaScript代碼文件運行於瀏覽器之中，面向對象的高級語言不管是項目開發管理，仍是項目開發的工具環境的成熟度都明顯優於JavaScript腳本語言，尤爲是中大型項目方面，AS3等高級語言的效率會更高。 從上圖看出，支持JavaScript語言的引擎更多，因爲AS3語言的編譯器爲Layabox引擎推出的，所以採用AS3做爲開發語言的僅有Layabox引擎。筆者建議在開發中大型遊戲項目的時候，採用TypeScript或者是Flash AS3語言進行開發。若是是小型遊戲，任選其一便可。 二、引擎的將來延續能力 選擇一個引擎，並非簡單的認爲，知足眼前夠用就能夠了，引擎的將來延續能力也是很重要的，這個項目是2D，下個項目想開發3D，若是引擎不支持怎麼辦？去換個引擎？若是VR的機會來了，再想發佈VR版本，這個引擎不支持，須要從新開發嗎？等等問題，做爲開發者儘量要提早想好。 經過上圖，能夠看出，即使是在支持webGL的H5引擎裏，有隻面向2D遊戲的，也有隻面向3D遊戲的，同時支持2D、3D、VR的H5引擎，從目前看只有Layabox與Egret引擎。 三、性能是核心需求 性能是H5遊戲面臨的核心門檻，也是不少H5遊戲不被專業玩家承認的重要緣由之一。遊戲卡頓，不流暢，這樣的產品體驗很難在激烈競爭中生存下來。 H5產業早期的普及階段即將過去，遊戲品質在迅速提升，品質中包括精細的美術和炫酷的動畫等。在複雜的遊戲項目面前，上述種種元素，其流暢體驗度對遊戲引擎是極大的考驗。因此選擇性能優秀的引擎是保證品質的最重要基礎，必定要謹慎。 在遊戲項目研發開始時，必定要先對複雜的模塊作DEMO測試，特別是帶背景滾動的遊戲。好比橫屏卷軸遊戲，對幀數穩定性要求極高，若是知足不了性能上的需求，可能會帶來眩暈、眼花、疲倦等不良體驗。 在webGL的2D渲染性能方面，pixi.js的性能處於當前的頂級。在webGL的3D渲染性能方面，Three.js很是優秀。在runtime方面Cocos2d-js也有着原生級的表現，通過對比，筆者認爲Layabox性能的綜合實力最強，在各個渲染領域都保持在HTML5引擎的頂級水平。固然，上圖僅做爲參考，對於任何號稱某個引擎性能最牛的論調，必定要親自進行性能DEMO的測試對比，而不要輕易採信。 因爲性能是遊戲最核心的需求，筆者這裏再多說一句，大型項目在系統複雜度、UI複雜度、動畫顯示數量和種類等方面與小型遊戲項目徹底不在一個量級。會涉及到比小遊戲更復雜的性能優化、內存管理、資源管理等需求，若是選擇了小馬拉大車的低性能引擎，項目夭折可能性很是大，除非最後項目開發者花大量時間本身優化引擎。因此性能差一點，就會致使結果差不少，不可主觀想象。 四、與引擎的應用廣度 隨着H5遊戲品質提高，在其餘領域也具有必定的競爭力和價值，一次開發可發行各個領域版本，已成爲日漸明確的需求，這裏麪包括髮行原生APP手遊和PC的flash頁遊需求，大統一的引擎時代即未來領。目前最火爆的H5遊戲《傳奇世界H5》聽說有40%的收入來自PC網頁。 發佈PC頁遊時，因爲PC瀏覽器目前對HTML5兼容性不足70%，用戶損耗很大，頁遊聯運平臺可能會拒絕或放量不多，只有採用能同時發佈Flash版本的引擎，才能解決這個問題。 五、設計理念與定位 設計理念是個比較大的話題，也是個很重要的引擎選擇因素，好比引擎是要專一移動端，仍是要面向全平臺多端遊戲市場。是注重性能，仍是注重工具鏈等等。深刻了解不一樣引擎的理念與定位，才能更好的與遊戲產品進行結合。 上圖內容僅做參考，詳情建議去各引擎官網深刻了解。 六、工做流支持力度 做爲商業級開源引擎，工具鏈的提供與支持也是一種選擇考量要素，好比UI編輯器、粒子編輯器、骨骼編輯器、場景編輯器等等，若是引擎方直接提供或支持，那麼將會較大的提高研發效率。 本文中提到的7個引擎，只有Egret、Layabox、Cocos2d-JS這三個引擎，在工具鏈方面提供足夠全面的支撐。 七、是否有成熟的商業案例 怎麼證實引擎是成熟的？必定要有成熟的商業案例，通常引擎的官網上都會有遊戲案例介紹，咱們在選擇引擎以前要進行深刻體驗，包括：商業案例的數量、商業案例的種類、穩定性、流暢度（要在低端機裏體驗）、項目複雜度、項目類似度等。若是有一些大型成功案例背書會相對安全可靠些。 從目前的行業案例來看，Layabox引擎的MMORPG《醉西遊》、重度動做遊戲《獵刃2》、大型模擬經營遊戲《夢幻家園》等無疑是H5引擎技術的最高水準表明做。可是從卡牌、掛機等類型的付費遊戲整體數量來看，Egret引擎明顯佔優，充分說明該引擎的市場宣傳力度更勝一籌。 八、學習資源與技術支持能力 能提供什麼樣的學習資源，以及技術支持，對於開發者也是重要因素，若是你是技術大牛，只想使用輕量的第三方渲染內核。那麼2D遊戲，pixi.js無疑是首選。3D遊戲，筆者推薦Three.js。可是這兩種引擎的學習資料都比較稀少。筆者認爲學習資料的完善，以及在學習過程當中的技術支持力度，將會很大的幫助你解決引擎使用中的問題。因此，API完善，DEMO完善，文檔完善，社區的響應速度，交流氛圍，以及QQ技術支持等，均可以做爲你選擇引擎的因素考量之一。 九、頁遊移植產品的引擎選擇 目前像《醉西遊》等優秀H5產品是Flash頁遊或手遊移植而成，移植類的產品在選用引擎時要注意，代碼是否能夠直接移植？若是能夠，那將節省大量的開發成本。好比Flash AS3開發的2D或3D頁遊或手遊，能夠把邏輯與算法代碼直接拷貝移植到Layabox引擎項目中，開發速度提升數倍。 寫在最後：最後提醒一下，千萬不要相信某些引擎的單方宣傳，必定要花一點時間去研究實踐，親自制做DEMO去做一做對比，動手體驗到的纔是真理。 針對DEMO測試筆者有幾點建議：         一、採用一個複雜的UI，特別是複雜列表，好比說沒有分頁的揹包列表，揹包裏放上不一樣的道具圖片，測試滑動時的流暢度，這塊比較考驗性能，元素越複雜，數據越多，尤爲能對比出來性能上的差別。         二、包含最複雜戰鬥部分，不要寫戰鬥邏輯代碼，否則會花的時間太長，只須要把戰鬥相關的動畫和複雜的元素放在場景中模擬便可，由於H5遊戲性能瓶頸一般在於畫面的顯示。         三、 測試主要目的是看項目在引擎中性能，這是最相當重要的，因此，硬件上，咱們要選擇低端安卓手機（好比紅米）進行測試。軟件環境建議使用微信環境測試，首先，由於微信公衆號是H5的主要渠道之一，其次，微信當前的H5性能低於chrome瀏覽器，在惡劣的環境下更能測試引擎的優劣。