0%

几款html 5 canvas游戏引擎的调研

为满足对用户增长的需求,游戏类活动页开发逐渐提上日程,而我们对这方面积累不多。

问题分析

引入游戏引擎原因

原生 canvas 只提供了画布实现,在游戏开发角度上,对开发者而言,仍有许多工作要做:

  • 场景构建(画面中不动的东西)
  • 物体构建(画面中动的东西)
  • 动画实现(让画面中的东西动起来)
  • 物理算法(模拟现实效果)
  • 游戏业务逻辑

其中,除游戏业务逻辑外,其余部分皆可重复使用。

所以,可以认为,引入游戏引擎有一定的必要性。

面向的业务场景与其带来的要求

我们的目的是用户增长,具体手段是营销活动页。

所以,游戏载体是营销活动页,则游戏的业务与体积都必须轻量、小型,便于用户接受、传播。

另外,微信小游戏在传播方面有其天然的巨大优势,在这方面也要有一定的考虑。

需求提取

对于游戏引擎的调研,需要从以下角度调研:

  • 文档可读性
  • 开发出来的产品的性能、体积
  • 其带来的工具链或解决方案是否契合我们的业务场景 – 轻量、小型的营销活动页、微信小游戏

目标引擎

hilo

Hilo 作为一个跨终端的互动小游戏解决方案,同时有称综合解决方案。从它的演变来看,Hilo 属于阿里前端在实践总总结出来的一套工具库。

Egret

Egret 不仅仅提供了一个基于 HTML5 技术的游戏引擎,更是提供了原生打包工具和众多周边产品,使其成为“解决方案”

Cocos

老牌又流行的解决方案

cocos creator

cocos-creator.png

Egret Engine 2D

Egret-Engine-2D.png

hilo

hilo.png

比较

满分 5 星

比较维度:

  • 文档
  • 原型构建(开发速度)
  • debug
  • 与现有开发流程、构建流程、业务体系结合
  • 后续运营维护(迭代、事件上报、日志上报)

cocos creator

  • 文档
    1. 较完善
    2. 有简单的实例教程
    3. cocos js 的文档老旧,与当前版本不符
    4. 结论:3 星
  • 原型构建(开发速度)
    1. 很大一部分是 UI 操作
    2. 结论:5 星
  • debug
    1. 报错信息完整
    2. 但要看懂报错信息的话,必须对 cocosjs 有一定了解
    3. 结论:1 星
  • 与现有开发流程、构建流程、业务体系结合
    1. 当前团队模块化方案为 commonjs, 构建工具为 gulp + webpack, 与后端结合点是后端模版直出+接口调用
    2. cocos creator 构建封闭程度较高,与现有业务结合有一定的配置工作
    3. 结论:1 星
  • 后续运营维护(迭代、事件上报、日志上报)
    1. 当前的事件上报、日志上报皆有 commonjs 规范的组件,不能和 creator 无缝结合
    2. creator 的开发为另一套流程体系,和现有体系需重新磨合,迭代有一定的磨合工作
    3. 结论:1 星

Egret Engine 2D

  • 文档
    1. 较完善
    2. 没有简单的实例教程,上手相对麻烦
    3. 结论:2 星
  • 原型构建(开发速度)
    1. 和当前前端开发形式一致
    2. 结论:3 星
  • debug
    1. 报错信息完整
    2. 结论:3 星
  • 与现有开发流程、构建流程、业务体系结合
    1. 当前团队模块化方案为 commonjs, 构建工具为 gulp + webpack, 与后端结合点是后端模版直出+接口调用
    2. Egret Engine 2D 构建封闭程度较高,与现有业务结合有一定的配置工作
    3. 结论:1 星
  • 后续运营维护(迭代、事件上报、日志上报)
    1. 当前的事件上报、日志上报皆有 commonjs 规范的组件,不能和 Egret Engine 2D 无缝结合
    2. Egret Engine 2D 的开发为另一套流程体系,和现有体系需重新磨合,迭代有一定的磨合工作
    3. Egret Engine 2D 基于 typescript,利于迭代维护
    4. 结论:2 星

hilo

  • 文档
    1. 较完善
    2. 有简单的实例教程
    3. 结论:5 星
  • 原型构建(开发速度)
    1. 和当前前端开发形式一致
    2. 结论:3 星
  • debug
    1. 报错信息完整
    2. 结论:3 星
  • 与现有开发流程、构建流程、业务体系结合
    1. 当前团队模块化方案为 commonjs, 构建工具为 gulp + webpack, 与后端结合点是后端模版直出+接口调用
    2. hilo 可使用 commonjs 模块方案加载,可用 gulp + webpack 构建,与后端结合也十分方便
    3. hilo 是针对运营活动类小游戏而产生的解决方案,和我们当前背景一致
    4. 结论:5 星
  • 后续运营维护(迭代、事件上报、日志上报)
    1. 当前的事件上报、日志上报皆有 commonjs 规范的组件,可以和 hilo 无缝结合
    2. hilo 可无缝融入当前开发体系
    3. 结论:5 星
众筹开高达