建站
咨詢
售后
建站咨詢
新聞中心
【稿件】隨著國內(nèi)的引擎開發(fā)技術(shù)的進步，2D游戲技術(shù)已經(jīng)成為市場主流，并正式拉開了3D游戲的序幕。白鷺時代CEO陳書藝表示，白鷺時代自2014年成立起，就致力于提升HTML5游戲性能，增強游戲的體驗。但HTML5游戲如果沒有統(tǒng)一的技術(shù)標(biāo)準(zhǔn)就開始做內(nèi)容創(chuàng)作很難成功，所以開發(fā)引擎是必然。白鷺引擎從1.0到4.0，一路走來，為HTML5游戲開發(fā)所面臨的開發(fā)效率、運行性能和資源加載量等難點做了很多貢獻。
成都創(chuàng)新互聯(lián)公司主營景縣網(wǎng)站建設(shè)的網(wǎng)絡(luò)公司,主營網(wǎng)站建設(shè)方案,手機APP定制開發(fā),景縣h5成都小程序開發(fā)搭建,景縣網(wǎng)站營銷推廣歡迎景縣等地區(qū)企業(yè)咨詢
難點一、 如何提升開發(fā)效率快速上線
對于開發(fā)商來說游戲開發(fā)效率是最重要的一個環(huán)節(jié)，有時候游戲晚推出一個月就會錯過最好的窗口期，而快速上線能夠留給自己更多的時間調(diào)整游戲。為提升開發(fā)效率，白鷺引擎API選擇Canvas、開發(fā)語言選擇Typescript。
為什么采用Canvas？游戲發(fā)展需要非常豐富細(xì)膩的動畫效果，DOM完全做不了這是白鷺引擎選擇Canvas的原因所在。Canvas是HTML5新API，還可以實現(xiàn)更多的復(fù)雜交互的效果。
為什么放棄Dart、AS3、JavaScript，最終選擇了TypeScript（后續(xù)簡稱TS）作為白鷺引擎的開發(fā)語言呢？TS是一個嚴(yán)格意義上JavaScript超集，而且它的語言設(shè)計非常符合JavaScrip的最新標(biāo)準(zhǔn)ES6。據(jù)白鷺引擎架構(gòu)師王澤介紹說：TS本身具有開源屬性，這意味著開發(fā)者可以自有更改其源代碼，同時，TS的架構(gòu)設(shè)計非常優(yōu)秀，為開發(fā)者的進一步擴展提供了充分的API接口，比如實現(xiàn)編譯器、自定義語法檢查以及自定義輸出結(jié)構(gòu)等。
不采用Dart、AS3、JavaScript作為開發(fā)語言原因如下：
1. 首先，Dart 的形式針對很多會使用 JS 或 AS3 的開發(fā)者而言（尤其是初學(xué)者這個最大的群體），學(xué)習(xí)的成本曲線較陡，而谷歌又是一個在技術(shù)上“太過”創(chuàng)新的公司，跟隨一個有可能“朝令夕改”的技術(shù)去制作一款產(chǎn)品，而且將整個白鷺的工具和服務(wù)的體系都懸于它之上，有一定的風(fēng)險。
2. AS3 首先是一個封閉的語言，而且 Flash 團隊已經(jīng)放棄 AS3 到 AS4，AVM2 到 AVM3 的項目，所以用不了全新的 ES6 新特性，雖然很遺憾，但是最終還是沒有選擇 AS3。
3. JavaScript是弱類型，會導(dǎo)致開發(fā)游戲效率低下，維護起來更加困難，代碼越寫越亂、越寫越多。
選擇TS還有兩個原因，如下：
其一，2014年初，中國擁有近30萬的Flash開發(fā)者，其中90%是游戲相關(guān)，這是一個寶貴的開發(fā)者社區(qū)群體，他們對于Web頁游的開發(fā)和理解遠(yuǎn)遠(yuǎn)超過了任何使用其他web前端技術(shù)做網(wǎng)頁游戲的群體。白鷺使用TS，一方面是為了讓JS游戲開發(fā)人員更舒服些，另一方面是想積極爭取Flash AS3的開發(fā)群體。
API設(shè)計上白鷺引擎與Flash AS3對比圖
其二：白鷺引擎基于Canvas用TS來封裝Flash ActionScript3.0對游戲有幫助的部分API結(jié)構(gòu)設(shè)計。上圖，是API設(shè)計上白鷺引擎與Flash AS3的對比，可看出兩者設(shè)計幾乎一致，這便于AS3開發(fā)者可以直接上手，進而保證HTML5游戲的開發(fā)效率。
一站式 HTML5 游戲開發(fā)工作流
如上圖，除了以上兩點外，白鷺時代為了進一步提升開發(fā)者的開發(fā)效率推出了一系列輔助工具，最終打造出了全球首個HTML5完整工作流。從代碼開發(fā)、UI搭建、資源管理、粒子特效等方面提供一站式 HTML5 游戲開發(fā)工作流，大幅度提升 HTML5 游戲開發(fā)效率。
難點二：游戲性能方面如何讓CP滿意
游戲性能一直是CP關(guān)注的重點，這部分白鷺引擎引用WebGL技術(shù)的同時還自主研發(fā)了臟矩形技術(shù)。
如上圖，臟矩形渲染是一種基于顯示列表的局部刷新方法。依然是要有一個時鐘頻率，定時每秒執(zhí)行60次。但區(qū)別是每次我們并不直接清空整個屏幕，而是首先計算屏幕上發(fā)生改變的區(qū)域，這里我們叫做重繪區(qū)，然后只清空指定的重繪區(qū)，并找出跟這個區(qū)域相交的所有顯示對象重繪一遍。如果顯示列表本次并沒有發(fā)生改變，那么將直接跳過本次繪制，什么也不做沒有使用臟矩形只有24幀，使用了臟矩形后能夠達(dá)到60幀滿運行。
如上圖，WebGL技術(shù)助力游戲性能實現(xiàn)巨大提升。早在2014年的時候白鷺時代就打算支持WebGL，但是當(dāng)時通過webglstats.com的數(shù)據(jù)統(tǒng)計發(fā)現(xiàn)當(dāng)時的WebGL支持率只有40%不到，所以當(dāng)時只能先從Canvas做起。但是我們看到截止2016年底，WebGL的支持率已經(jīng)達(dá)到了90%以上。而且得益于微信 X5 瀏覽服務(wù)，在國內(nèi)支持率基本達(dá)到100%。值得高興的是，這時候采用白鷺引擎WebGL技術(shù)的 《決戰(zhàn)沙城 H5》獲得了超1000w月流水的好成績。
如上圖，除了上述兩個技術(shù)以外， 白鷺引擎還提供名為Egret Runtimes的解決方案來提高HTML5游戲的運行效率，在提升 HTML5 游戲運行性能的同時還可移動設(shè)備兼容性問題。
Egret Runtime是一個加速器組件?？蓪崿F(xiàn)游戲運行加速，渠道接入加速。還可作為擴展模塊無縫嵌入到移動設(shè)備上的瀏覽器或其它應(yīng)用中。 游戲開發(fā)者能夠忽略不同操作系統(tǒng)、不同瀏覽器、和不同終端的差異，讓HTML5游戲以接近原生的表現(xiàn)在用戶手機終端中高效運行；渠道接入商可以簡化繁瑣游戲接入流程，實現(xiàn)一次 Egret Runtime 接入，HTML5 游戲隨時上架的高效游戲接入。
難點三：資源加載量問題
基于中國現(xiàn)有網(wǎng)絡(luò)條件下還要考慮游戲資源的加載速度。如上圖，根據(jù)中國移動用戶數(shù)據(jù)，2014年2月4G用戶數(shù)不到1000w，用戶手機網(wǎng)絡(luò)條件太差。針對這一現(xiàn)象，白鷺引擎內(nèi)置文理集支持的同時引入了全新的資源管理框架。
白鷺引擎內(nèi)置了紋理集的支持，而且提供了配套的工具Texture Merger。在2014年的網(wǎng)絡(luò)環(huán)境下每減少1kb的資源體積就意味著用戶流失率的一點點降低。紋理集聽上去名稱高大上，實則概念非常簡單。紋理集實際上就是將一些零碎的小圖放到一張大圖當(dāng)中。游戲中也經(jīng)常使用到紋理集。使用紋理集的好處很多，我們通過將大量的圖片拼合為一張圖片從而減少網(wǎng)絡(luò)請求，原先加載數(shù)次的圖片資源現(xiàn)在加載一次即可。 同時，在引擎渲染的時候也會較少IO讀取，從而提高性能。紋理集甚至能減少一半的資源體積。
近期發(fā)布的白鷺引擎 4.0 引入全新的資源管理框架，包含版本控制與熱更新功能，允許針對不同平臺發(fā)布資源，加載體積減少30%。
白鷺引擎的現(xiàn)狀及未來挑戰(zhàn)
白鷺最新發(fā)布的引擎4.0版本中，圍繞用戶在H5游戲開發(fā)過程中遇到的“運行效率”、“開發(fā)效率”和“網(wǎng)絡(luò)加載效率”三大核心問題進行升級。在H5 3D游戲方面，白鷺已經(jīng)成功邁出了第一步，但未來還有很長的路要走。白鷺引擎4.0版本全新的Egret 3D，無論功能還是性能，以及配套的IDE和插件體系，都能助力CP制作重度化3D H5游戲。據(jù)白鷺首席架構(gòu)師王澤介紹，白鷺3D引擎不止可以幫助中小型研發(fā)團隊完成2D及簡單的輕型3D作品，其獨有的高質(zhì)量Lightmap烘培解決方案更是提高了3D游戲的視覺門檻，完美呈現(xiàn)大型重度的游戲體驗。
【原創(chuàng)稿件，合作站點轉(zhuǎn)載請注明原文作者和出處為.com】
名稱欄目：HTML5游戲開發(fā)難點之效率、性能和加載量
轉(zhuǎn)載注明：http://www.5511xx.com/article/djjjsco.html
