基于學習的造輪子,這是一個最簡單,最基礎的一個canvas渲染引擎,通過這個引擎架構,可以很快的學習canvas渲染模式!
地址:https://github.com/RichLiu1023/h5engine
這是一個比較有意思的h5渲染引擎,我肯定寫的不好,以前也從沒寫過這東西,出于好奇,看了下前端h5 canvas
的渲染api,然后看了egret
的引擎,覺得還是動手做一下比較好,于是就開始造輪子了,額這個比較有趣,從渲染模型、臟矩形、加載等一串玩意,通過一步步的實現寫出來還看得過去的引擎demo,當然,重在過程!這個過程讓我受益匪淺!
- 使用TypeScript開發
- 網絡通信使用socket.io
安裝
項目使用gulp
打包,因此需要安裝nodejs
,及gulp模塊。
安裝好nodejs后安裝全局gulp管理包:
npm install -g gulp
cd進入項目目錄然后執行:
npm install
package.json
中有依賴的包
在項目目錄中執行
- gulp buildJS 生成合并后的js文件及map文件
- gulp buildDTS 生成TypeScript引用的d.ts文件
使用
請看GameTest
項目,并運行看結果。