初探Egret3D——白鷺引擎架構師王澤演講實錄

10月19日，白鷺開發者沙龍武漢站在武漢將來夢境空間舉辦。白鷺引擎首席架構師王澤在現場以《初探Egret3D》爲題爲到場的開發者介紹了Egret3D引擎，咱們整理了現場速記分享給你們，詳見下文：

王澤：各位開發者下午好，今天我爲你們分享的題目是《初探Egret 3D》。這是咱們白鷺引擎第一次在開發者沙龍中用一個完整的演講主題中介紹 Egret3D。首先咱們經過這張總體架構圖來看，Egret3D 包含了四大部分，分別是運行時，編輯器，Unity3D導出插件以及文檔中心。接下來的演講中我會針對這四項內容給各位開發者作一個完整的介紹。

第一部分是運行時。他指的是遊戲在運行時所依賴的JavaScript 邏輯代碼，也就是開發者開發的遊戲最終運行依賴於底層白鷺引擎的 Library。這部份內容是徹底開源的，每一位開發者均可以經過 GitHub 或者白鷺引擎的工具來下載，咱們會以每個月更新一次的節奏對運行時邏輯進行更新。目前版本號是1.2。

第二部分是編輯器。白鷺引擎的3D編輯器目前正在處於內測階段，咱們免費提供給二十個使用Egret3D的研發團隊進行試用，目標是在 2018年12月份向全部開發者開放。目前加入咱們的內測計劃也很是的簡單，只須要將您的項目信息和公司信息發送給 wangze@egret.com，咱們就會在和您確認後儘快將編輯器提供給您，並在咱們力所能及的範圍內爲您提供儘量完備的技術支持。

第三部分是Unity導出插件。目前白鷺引擎的3D編輯器主要用於編輯基於實體組件系統模式的組件數據以及場景信息，在3D資源編輯方面，好比3D粒子編輯、3D動畫編輯目前還沒有實現，因此咱們採用了 Unity3D資源導出的方式來爲遊戲製做這部份內容。若是開發者已經開發了一款基於Unity3D引擎的遊戲，能夠直接把它的資源置換白鷺引擎的格式。這部分咱們目前計劃在11月份將其開源。

第四部分是文檔中心。咱們認爲文檔是引擎中很是重要的一部分。自從Egret3D 發佈後，咱們一直在不斷提高咱們的文檔數量和質量。在九月份，咱們文檔中心有29篇Egret3D文檔，平均每篇文章590字，在10月初，文章數量提高到了36篇，平均字數提高到了900字。咱們的目標在每個版本都把文檔數量以及每篇文檔的平均字數字都儘量的提升，一遍儘量的解決開發者在平常開發時所遇到的問題。

對這四方面進行了簡單介紹後，接下來我將對運行時和編輯器這兩部分進行更詳細的介紹。

白鷺引擎的運行時包含了三大部分組成，第一部分是白鷺引擎的實體組件系統，他是Egret3D的總體框架；第二部分是3D渲染部分，第三個是白鷺引擎的3D和2D的適配器。

運行時庫的第一部分是實習組件系統架構。Egret3D中包含了兩個命名空間，分別是 paper和egret3d。爲何有這樣區別呢？開發者能夠這樣簡單理解，全部與實體組件系統架構相關的API，咱們放在paper命名空間內，由於這些內容是與3D渲染無關的，這樣在將來，咱們會把與Egret2D相關的內容也集成到這個實體組件系統的架構中。白鷺引擎2D、3D做爲總體來支持。

實體組件系統架構中的實體指的是遊戲對象GameObject，每個實體其實只是一個空殼，數據在GameObject掛載的Component中，原則上組件只包含數據，不包含行爲。真正的行爲由System來決定，也就是說在遊戲引擎底層運行的時候，由各個不一樣的System驅動整個引擎的運行。每個System，好比渲染、物理、動畫，都去尋找不一樣的組件，並經過組件分別完成屬於本身的邏輯。

在開發者比較熟悉的Unity3D中，和這套架構有些區別的是，Unity3D的Behaviour至關於Component，可是是能夠包含邏輯的Component，爲了Unity3D開發者開發方便，咱們也支持這種模式，容許在Component中添加行爲，您能夠繼續按照Unity那樣的方式作你的一款3D遊戲。

運行時庫的第二部分是3D渲染。Egret3D目前採用 WebGL1.0的接口，並以 Extension的方式添加部分 WebGL2.0特性。之因此這樣是由於WebGL2.0目前的設備覆蓋率仍是比較低的，而WebGL1.0的設備覆蓋率已經超過了90%。目前只有iOS8.0、Android5.0以前的設備是不支持WebGL1.0的，而這些設備的總體市場份額已經幾乎能夠忽略。

在一款3D遊戲中，須要大量的模型資源與配置資源，Egret3D使用 GLTF 這一標準格式。這種格式有個很是好的優勢是，它是爲OpenGL/WebGL接口而設計的格式，所以底層的解析效率會很是高。我舉一個實際的例子，Egret3D在去年發佈了內測版本，他的具體模型解析流程是這樣的：第一步須要加載一個模型文件，而後將模型文件進行解析，而後生成WebGL所須要的數據格式，最後提交到GPU中，這樣纔是一個完整的過程。接下來咱們看看今年發佈的 Egret3D正式版的架構。咱們如今添加的模型文件是一個 GLTF格式文件，這種格式在加載後無需進行解析和生成，只須要對其進行一個很是簡單的切割，就能夠將它的數據直接上傳到GPU 中。你們會發現，解析模型和生成WebGL數據這兩個很是耗時的操做被直接繞過去了。實現了從瀏覽器加載到提交數據之間的無縫對接，經過這種設計，Egret3D與去年的內測版相比，模型解析速度提高了170%，內存下降了一倍，用戶能夠感知到的加載速度也提高了30%。

在3D渲染中下一個值得一提的話題是如何將 3D部分與2D進行集成。白鷺引擎目前支持在3D的架構中隨意添加2D內容，若是想在2D內容中添加3D內容則會稍微複雜一些，您須要先建立3D內容，再把現有的2D內容添加進去。這個問題涉及到遊戲引擎的開發思路。白鷺引擎在5年前剛發佈的時候是一款2D引擎。若是想在2D引擎中添加3D特性，第一種作法是作一款與2D沒有關聯的3D引擎，而後將2D部分放在3D之中，這也是白鷺引擎如今的作法。

除此以外還有第二種作法，就是在一款2D引擎的基礎上進行不斷擴展，不斷在其中堆疊新的3D功能，最終實現一款3D引擎。這種作法的優點在於2D遊戲能夠相對簡單的添加一些簡單的3D內容，可是想經過這樣的方式最終實現一款3D引擎則是比較複雜的。所以咱們沒有采用這樣的方法，而是用第一種作法開發了全新的Egret3D。客觀來說，這樣作的缺點，這是對開發者而言最開始學習的入門門檻稍微高一點，可是從長遠來看這個是值得的。

剛纔的演講中，我已經介紹了Egret3D運行的實體組件系統架構，GLTF文件格式，3D渲染流程，以及與 Egret2D的集成方式。如今咱們進入Egret3D 編輯器的環節，我相信這也是開發者們很是關心的。

咱們認爲3D編輯器是3D遊戲開發中不可或缺的一個環節。也許2D遊戲能夠不須要編輯器，可是3D遊戲沒有編輯器幾乎是步履維艱。假設咱們如今須要渲染一張圖片，可是目前屏幕是黑屏的沒有渲染出來，在2D中，致使出現這個問題的緣由很簡單，對象未加載到舞臺、對象的透明度設置爲0，對象的座標在屏幕外，對象的紋理沒有加載，基本只有這幾種可能。可是在3D中，除了上述這些以外，還有不少狀況。首先，座標系不僅是x,y兩方向，還引入了z方向。還有多是攝像機的的位置不對，攝像機的朝向不對，圖片的材質不對，燈光設置不對等諸多狀況。在這麼複雜的狀況下若是沒有編輯器進行編輯是很是困難的。爲了解決這個問題，白鷺引擎的解決方案是爲開發者提供一款3D編輯器。在遊戲開發過程當中，編輯器的時候直接能夠看到你遊戲中全部的對象，好比說人物，攝像機，燈光，這些東西他們在哪裏，，這樣就會很是直觀的看到遊戲對象沒有正確渲染的本質緣由是什麼。

除了編輯器以外，咱們還提供了一款開源的名爲 Egret3D Inspector的工具用於提高開發者的開發效率。這個工具是Egret3D編輯器的核心構成，能夠在遊戲運行時直接顯示遊戲每個對象的屬性，並在預覽模式下對其數值進行調整。經過這種方式，哪怕您沒有Egret3D編輯器，也能夠經過這款工具提高遊戲的開發效率。

那接下來看的，若是有編輯器你是如何開發一款3D遊戲的？有兩種方式，第一種是沒有編輯器的狀況，您能夠在Unity3D裏面編輯，把全部場景，資源，Prefab等內容所有處理好，經過白鷺引擎的Unity3D導出插件，把這些內容發佈到 Egret3D中，而後在瀏覽器直接看到效果，最後直接發佈到微信小遊戲，或者將來的更多平臺上。

除此以外，若是您如今已經有了Egret3D編輯器，能夠在Unity3D中的資源導出後，在 Egret3D編輯器中進行二次編輯。咱們開發團隊的工做流是，在Unity3D中負責製做素材，而後在 Egret3D 編輯器中負責編輯場景、添加組件和調整組件數值預覽。

而後具體實際案例能夠看看白鷺Egret3D的案例，《泡泡學園OL》，這款遊戲的開發手段就是我剛纔說的那樣，使用 Unity3D 製做模型，而後在Egret3D 編輯器中進行二次編輯，主要是掛載組件，以及調整數值和場景。這個遊戲咱們已經發布了小遊戲版本，其中一些性能指標基本是目前Egret3D能發佈到微信小遊戲的極限，其中 Vertex數據能夠更高一些，因爲這款遊戲包含了比較複雜的使用CPU計算的碰撞引擎和行爲樹AI，因此咱們犧牲了部分Vertex來換取更高的性能。開發者若是作的遊戲不須要這些高級功能，Vertex能夠提高到200,000以上。

剛纔跟你們介紹是Egret3D的整個發展狀況，咱們回顧一下咱們今年的總體版本發佈計劃。咱們在今年5月份的時候第一次發佈了白鷺引擎3D的正式版本，而後接下來發布了0.9版本，支持微信小遊戲版本，1.0版本是系統優化，在1.1版本的時候，3D引擎編輯器提供了內測，在10月8號的時候，過了十一以後發了1.2版本，目前最高的版本，咱們發佈了Egret Inspector 3D提高開發效率，並擴大了3D的編輯器的內測方位。會在2018年11月份發佈1.3版本，咱們會進一步擴大編輯器的內測範圍，並對底層性能和效果，特別是燈光方面進行進一步的完善。

除了 Egret3D以外，今天我也首次向開發者介紹一下Egret 2D 部分在2018年第四季度的路線圖。2018年第四季度咱們的目標是發佈白鷺引擎 5.4 正式版本，在這個版本里面咱們重點優化這幾個方面。

第一是將大幅度提高編譯速度，預期是把開發者在編譯上的時間變成原來的1/5，假設開發者天天工做10小時，其中1個小時的時間是用在編譯上，但願把這個時間將來能從1小時變成12分鐘，這樣理論上你們早下班一個小時。

第二個就是引擎瘦身。白鷺引擎的核心庫裏面去掉一些老舊API的支持，白鷺引擎目前能夠運行在 IE9等老式瀏覽器內核上，這部分的支持咱們將來不會做爲引擎核心，而是做爲一個第三方庫提供給開發者，這樣若是開發者無需對這種設備提供支持的話，就能夠下降引擎體積，咱們的目標是下降50K左右。

第三就是2D的工做流工具更新，咱們會在 2018年末將白鷺引擎的 2D工做流進行一個較大的升級，在用戶體驗基本不變的狀況下，進行架構升級，解決一些長久以來的遺留問題。這一部分咱們已經進行了接近一年時間，2018年Q4是會中釋放給開發者。

最後一條，我認爲很是重要，支持白鷺引擎發佈到更多的平臺，今天白鷺引擎能夠發佈到H5，IOS，安卓，還有微信小遊戲、QQ玩一玩等等不少的平臺，2018的Q4版本咱們將支持發佈到更多的平臺上，敬請期待。