激情六月丁香婷婷|亚洲色图AV二区|丝袜AV日韩AV|久草视频在线分类|伊人九九精品视频|国产精品一级电影|久草视频在线99|在线看的av网址|伊人99精品无码|午夜无码视频在线

高校合作1：010-59833514 ?咨詢電話：400-810-1418 服務(wù)與監(jiān)督電話：400-810-1418轉(zhuǎn)接2

h5游戲用什么開(kāi)發(fā)(Hilo)

發(fā)布時(shí)間：2023-11-27 23:16:02 瀏覽量：130次

?Hilo

h5游戲用什么開(kāi)發(fā)(Hilo)

今天推薦一個(gè)適合用來(lái)做營(yíng)銷小游戲的 H5 游戲引擎，輕量簡(jiǎn)單容易上手，快速上線提前下班靠它了。

Hilo 是阿里團(tuán)隊(duì)推出的一個(gè)開(kāi)源的 H5 游戲引擎，特點(diǎn)是對(duì)非游戲從業(yè)的前端開(kāi)發(fā)者非常友好，輕量無(wú)依賴，適合用來(lái)開(kāi)發(fā)營(yíng)銷小游戲。

Hilo 官網(wǎng)

作為一款阿里團(tuán)隊(duì)內(nèi)部一直在使用游戲引擎，Hilo 活躍在阿里系大量的電商節(jié)日和活動(dòng)中，比如往年的雙十一狂歡城、手機(jī)淘寶中使用 webview 加載的打年獸、618 搶豪車、雙十一紅包雨等 H5 互動(dòng)游戲，都是基于 Hilo 開(kāi)發(fā)。

Hilo 作品例子

  • 支持模塊化開(kāi)發(fā)，同時(shí)提供獨(dú)立版本(可直接引入) / RequireJS(AMD) / CommonJS / SeaJS(CMD) / Kissy 等多種模塊方式的包裝版本和跨終端解決方案，滿足不同前端開(kāi)發(fā)者的習(xí)慣
  • 無(wú)依賴于其他包，輕量到只有 70 KB 的體積
  • 支持 DOM 渲染，Canvas 渲染和 WebGL 渲染，集成了 Hilo Audio (游戲音頻音效)、 Hilo Preload (預(yù)加載) 和動(dòng)畫(huà)紋理等工具

Hilo 文檔

我學(xué)習(xí)和使用 Hilo 源自于一次時(shí)間緊迫的營(yíng)銷開(kāi)發(fā)需求 – 紅包雨，這個(gè)需求的技術(shù)要求是對(duì)動(dòng)畫(huà)流暢度和點(diǎn)擊響應(yīng)速度的保障。使用常規(guī)的 div + css ，貌似難以支撐需求，轉(zhuǎn)而做了 H5 游戲引擎的技術(shù)調(diào)研。

在對(duì)比了市面上相對(duì)專業(yè)的 H5 游戲引擎（比如 Cocos2d-x / Egret 白鷺引擎 / createjs 和 Phaser），發(fā)現(xiàn)這些引擎不僅專業(yè)，還有海量的文檔，沒(méi)有一定的游戲開(kāi)發(fā)技術(shù)，很難在短時(shí)間啃下來(lái)。后面偶然發(fā)現(xiàn)了 Hilo 這款不太知名的游戲框架，從它的演變來(lái)看，發(fā)現(xiàn) Hilo 屬于阿里前端團(tuán)隊(duì)在實(shí)踐中封裝出來(lái)的一套工具庫(kù)。

從 Hilo 支持的 API 看，Hilo 的設(shè)計(jì)思路更加偏向于前端開(kāi)發(fā)者，而非游戲開(kāi)發(fā)者，在 javascript 基礎(chǔ)過(guò)關(guān)的情況下，借助官網(wǎng)的文檔，上手很快。官網(wǎng)提供了一個(gè)循循善誘的 Flappy Bird 休閑小游戲的教程，當(dāng)天我用了一個(gè)下午的時(shí)間跟著做，游戲開(kāi)發(fā)中舞臺(tái)、場(chǎng)景、動(dòng)畫(huà)、容易等概念基本弄懂，用來(lái)做簡(jiǎn)單營(yíng)銷互動(dòng)小游戲再適合不過(guò)了。

在后續(xù)長(zhǎng)達(dá) 1 年的工作中，我還基于 Hilo 搭建了一套簡(jiǎn)單的內(nèi)部使用可視化互動(dòng)書(shū)編輯器，總結(jié)出使用 Hilo 開(kāi)發(fā)的幾個(gè)需要注意的點(diǎn)：

  1. 如果要做全屏小游戲，Hilo 沒(méi)有提供特別好的全屏適配方案，按照官方提供的代碼例子，整個(gè)舞臺(tái)以及里面的元素會(huì)變形，需要做一些屏幕參數(shù)計(jì)算的額外工作
  2. 可能是阿里外部用的人不太多，官網(wǎng)提供的代碼例子比較少，雖然有交流群，但我遇到奇怪的問(wèn)題，幾乎都是自行解決
  3. 如果不是像 2048 這種休閑益智類小游戲，不要選擇 DOM 模式來(lái)渲染，DOM 模式雖然性能開(kāi)銷小，但是對(duì)與動(dòng)畫(huà)流暢度和點(diǎn)擊響應(yīng)速度是真不好
  4. 官方的圖片、音頻預(yù)加載工具不好用，我用的 preload.js 代替的

Hilo 是一個(gè)入門(mén)級(jí)的 H5 游戲引擎，讓前端開(kāi)發(fā)者不用具備太多游戲開(kāi)發(fā)知識(shí)，就可以開(kāi)發(fā)互動(dòng)小游戲，用來(lái)做營(yíng)銷互動(dòng)游戲或者開(kāi)發(fā)簡(jiǎn)單的休閑小游戲是完全夠用的，也特別適合用 webview 內(nèi)嵌 H5 游戲在 APP 應(yīng)用中。當(dāng)然如果你想轉(zhuǎn)游戲開(kāi)發(fā)，還是得學(xué)習(xí) Cocos2d-x / Egret 白鷺引擎 / Phaser 這樣的引擎，他們都包含諸如物理引擎、3D 渲染、骨骼動(dòng)畫(huà)等完整支撐，以及提供了對(duì)游戲素材生成的工具，甚至可以編譯成原生 APP。在這之前，也可以先花一點(diǎn)點(diǎn)時(shí)間了解 Hilo，作為游戲開(kāi)發(fā)入門(mén)的第一課吧。

如果只是為了做動(dòng)畫(huà)效果，可以看看之前推薦的 SpriteJs 和 lucky canvas（抽獎(jiǎng)?lì)悗?kù)）。

Hilo 是阿里巴巴前端團(tuán)隊(duì)出品的 H5 游戲引擎，源碼基于 MIT 開(kāi)源協(xié)議托管在 Github 上，任何個(gè)人和公司都可以免費(fèi)下載使用在自己的項(xiàng)目上。

h5游戲用什么開(kāi)發(fā)(Hilo)

關(guān)注我，持續(xù)分享高質(zhì)量的免費(fèi)開(kāi)源、免費(fèi)商用的資源。

↓↓點(diǎn)擊查看本次分享的網(wǎng)址。

Hilo - 阿里巴巴出品的免費(fèi)開(kāi)源 H5 游戲引擎，輕巧無(wú)依賴，適合用來(lái)開(kāi)發(fā)營(yíng)銷互動(dòng)小游戲｜那些免費(fèi)的磚

h5游戲用什么開(kāi)發(fā)(Hilo)

熱門(mén)課程推薦

熱門(mén)資訊

請(qǐng)綁定手機(jī)號(hào)

獲取驗(yàn)證碼
x

同學(xué)您好！

您已成功報(bào)名0元試學(xué)活動(dòng)，老師會(huì)在第一時(shí)間與您取得聯(lián)系，請(qǐng)保持電話暢通！
確定