2016年 最火的 15 款 HTML5 游戏引擎

Posted 2020-07-03 qianqianlianmeng

html5游戏从2014年Egret引擎开发的神经猫引爆朋友圈之后，就开始一发不可收拾，今年《传奇世界》更是突破流水2000万！从两年多的发展来看，游戏开发变得越来越复杂，需要制作各种炫丽的效果，还要制作各种基于 2D 或者 3D 的场景。作为一名开发者，分析了当下最火爆，最热门的HTML5游戏引擎供大家参考，希望大家也能找到属于自己的那款游戏开发引擎。

我在github上面收集了四十多款的HTML5开源游戏引擎，从里面star、fork等等参数分析其流行度，最后综合各方面元素，筛选出靠前的十五款（包含三款非开源游戏引擎）

免费

Name	Updated Time	Watch	Star	Fork	Commits	Contributors
Three.js	2016/3/28	1590	24041	7768	14825	588
Phaser	2016/2/18	837	11782	4095	4423	206
Pixi.js	2016/3/17	656	10063	1942	2860	161
egret	2016/3/30	215	1275	303	4268	25
enchantjs	2016/1/4	185	1445	301	1683	27
crafty	2016/3/21	134	2050	473	1807	106
turbulenz	2015/11/23	271	2544	406	1737	13
cocos2d-js	2016/3/30	162	1207	469	4559	45
playcanvas	2016/3/30	164	1784	368	5142	16
melonjs	2016/3/30	13	1579	371	3907	40
quintus	2016/2/3	136	1023	412	256	33
Hilo	2016/2/3	173	2449	340	20	2

收费

Name	Updated Time
Construct 2	2016/1/18
ImpactJS	2016/1/18
GameMaker	2016/1/18

1、Construct 2

Construct 2是一个运行于Windows平台的游戏制作工具，它可以让没有任何编程基础的用户在短时间内不写一行代码快速开发出一款可运行于所有平台（Windows、Mac、Linux、android、ios等）的游戏。免费版可以将游戏导出成HTML5。收费版本分为个人版（79英镑）和企业版（259英镑），可以导出所有平台的版本，同时提供了更多的特效和音乐。如果使用该工具盈利超过5000美元，需要升级到企业版。

 

 

 

特点：

简单直观，入门容易，无需编程也能做游戏，长处是开发射击及动作类的平面游戏，有丰富的英文资料。

优点：

1. 支持多平台（Android，iOS，Windows)
2. 简单易用、无需编程知识可以使用，可实时运行游戏；
3. 提供了大量特效，支持物理效果，有开发者商城，在上面可以购买到各种开发插件和游戏素材；
4. 强大的事件系统，可以不通过写代码来控制游戏逻辑；
5. 提供了可编程扩展的接口，可以自己开发插件；
6. 完整的文档以及社区支持。

缺点：

1. 非开源，且中文教程极其匮乏；
2. 由于网页，手机都是相对于电脑来说性能较低的硬件产品，所以需要开发者更好的运用系统资源，甚至在windows平台也是如此，因为其windows的输出格式也是利用Chrome浏览器的内核所做，也就是说本质上还是在浏览器上运行。

点评：使用最多的HTML5商业引擎，更新快且开发者商城支持非常棒，推荐！**

2、Three.js

Three.js 是一款运行在浏览器中的 3D 引擎，你可以用它创建各种三维场景，包括了摄影机、光影、材质等各种对象。你可以在它的主页上看到许多精采的演示。

 

 

3、Phaser

Phaser是一款专门用于桌面及移动HTML5 2D游戏开发的开源免费框架，提供javascript和TypeScript双重支持，内置游戏对象的物理属性，采用Pixi.js引擎以加快Canvas和WebGL渲染，基于浏览器支持可自由切换。
快速、免费、易于维护，使用Phaser来开发2D小游戏的优势显而易见。一方面，开发者可以直接通过Koding平台上的VM开发系统进行代码编写及预览。另一方面，也可以在支持Canvas的浏览器中直接安装Phaser来进行游戏开发。

 

 

主要特性：

1. JavaScript、TypeScript双重支持
2. 内置游戏对象的物理属性
3. WebGL、Canvas渲染自由切换
4. 完全支持Web音频
5. 输入：多点触控、键盘、鼠标、MSPointer事件
6. 除了IE 9+、Firefox、Chrome、Safari及Opera等桌面浏览器之外，Phaser还支持Mobile Chrome（Android 2.2+）及Mobile Safari（iOS 5+）等移动浏览器。使用Phaser进行游戏开发没有任何语言设定，并且，在Phaser官网上，还提供了非常详细的开发指南，想要一探究竟的开发者不妨直接登陆Phaser查看。

4、 Pixi.js

Pixi.js是一款超快的开源HTML5 2D渲染引擎，使用带有Canvas回调功能的WebGL。作为JavaScript的2D渲染器，Pixi的目标是，可以提供一个快速且轻量级的2D库，并能兼容所有设备。此外，让开发者无需了解WebGL，就可以感受到硬件加速的力量。

 

 

主要特性：

1. 真正的跨平台：在今天，开发工具跨平台已经不是什么稀奇的事了。不过，Pixi.js则是一个可以兼容所有设备的超快HTML5 2D渲染引擎，并且拥有canvas回调功能的WebGL，实现真正的跨平台。
2. 交互式多点触控：Pixi不仅支持移动和平板设备，还具有完整的多点触控输入识别，让开发者可以发挥自己的能力去挖掘出它所有的潜力。
3. WebGL过滤器：当使用WebGL时，Pixi允许你使用自己熟悉且现有的过滤器。当然，你也可以使用自己创建的独一无二的过滤器，比如自定位移和半色调效果。
4. 着色和混合模式：对设计师来说，会很喜欢这个，Pixi.js允许用户着色和使用混合模式就像其他常见的视觉包比如Photoshop或Flash。
5. 渲染器自动检测：这个算是Pixi的一大特色，虽然Pixi是主要作为WebGL 2D渲染器而创建的，但仍支持非WebGL平台。其解决方案就是创建一个Canvas回调系统，只需一次编码，Pixi就可无缝管理回调。
6. 简易API：设计直观，易于上手。
7. 资源加载：精灵表单、图形、字体和动画数据等都可通过Pixi.js来加载和处理。
8. 支持精灵表单（Sprite sheet）。

5、 egret

Egret 游戏解决方案包含了开源免费的 HTML5 游戏引擎、Egret 项目开发工具集合、动画特效制作工具、原生多平台打包工具、高效的 HTML5 游戏应用加速器、以及支持多渠道的开放平台等。开发者可以通过Egret项目开发工具快速、高效的制作及开发游戏相关各类内容，加速器将游戏效果提高到与原生游戏相媲美的效果。制作后的游戏发布到开放平台后，有着优质的渠道资源可以将游戏推荐给更多的用户，使得游戏开发、发布、推广变为一体化内容。

 

 

主要特性：

1. 基于TypeScript及JavaScript技术，支持Flash到Egret高效转换，引擎、工具、运行时完整工作流
2. 跨平台：HTML5,iOS,Android,Windows Phone
3. 全中文文档：文档与开发者社区齐全
4. 开源免费，BSD开源协议、任意定制及扩展

6、enchantjs

Enchant.js 是个简单的 JavaScript 框架，可以使用 HTML5 和 JavaScript 来开发简单的游戏和应用。现在还是由 UEI 的 Akihabara 研究中心来开发和维护。在线演示

 

 

7、crafty

Crafty是一个体积小、简单、轻量级的2D的HTML5游戏引擎，它提供了通过Canvas或DOM来绘制实体，提供了精灵Map以及SAT高级碰撞监测支持。它是由个人（Louis Stowasser）创建，同时由Github上的一些开发者共同开发。

 

 

优点

1. 体积小
2. 轻量级引擎，不会受到框架的太多束缚
3. 同时支持PC和移动平台浏览器

8、turbulenz

Turbulenz是一个开源的HTML5游戏引擎，提供了可以运行在Windows、MacOS、Linux上的SDK，允许开发人员创建高质量和硬件加速的2D、3D游戏。包括以下功能：异步资源加载、进行特效和粒子渲染、支持物理效果、碰撞检测以及动画、3D音效支持、支持网络交互以及社交网络分享、场景和资源的管理。

 

优点：
1. 功能强大，同时支持2D和3D
2. 基于MIT协议的开源引擎

 

9、cocos2d-js

cocos2d-js是一款基于Cocos2d-x API的2D开源免费HTML5游戏引擎。它目前通过canvas进行渲染，将来会支持WebGL。它由国内Cocos2d-x核心团队主导开发和维护，行业领袖、HTML5大力推动者Google为这个项目提供支持。同时，Zynga、Google等大公司的工程师也参与到它的设计工作中。

 

 

优点：

1. 与Cocos2d的API类似，容易上手
2. 中文文档齐全，资料丰富
3. 基于MIT协议的开源引擎

10、playcanvas

PlayCanvas是一个基于 WebGL游戏引擎 的企业级开源JavaScript框架，它有许多的开发工具能帮你快速创建3D游戏。PlayCanvas.js由一个专业社区创建，最初并不是开源的，但现在你可以在github上fork PlayCanvas.js，然后在你的下一个3D游戏项目中免费使用。
它还提供了能在浏览器中云心的云编辑器，开始使用PalyCanvas和导航到编辑器的URL一样容易。

 

 

11、melonjs

melonJS是一个全新、轻量级，基于精灵的2D游戏引擎。兼容所有支持HTML5览器包括：Chrome、Safari、Firefox、Opera。支持多声道。提供基本物理和碰撞机制（以确保CPU的要求低），一组基础的实体对象（可扩展）。支持补间动画效果。一个状态管理器（可以轻松管理加载，菜单，选项和在游戏画面状态的开关）。提供一些基本的GUI元素。一个可定制的加载器。 

 

 

12、quintus

Quintus是一款易于上手、轻量级、开源的HTML5 JavaScript游戏引擎，包含一个模块化的引擎可轻松开发游戏，并在同一个页面上运行多个实例，支持桌面及移动平台浏览器。Quintus引用面向对象的思想来进行HTML5游戏开发，同时依赖于jQuery来提供事件处理机制和元素选取操作。

 

 

13、ImpactJS

ImpactJS是一个基于JavaScript的HTML5游戏引擎，同时支持PC和移动平台浏览器。它是目前除了Construct2之外最受欢迎的HTML5游戏引擎，使用需要支付99美元。

 

 

ImpactJS 曾经风靡一时，使用ImpactJS 开发的Z-Type该游戏被国外很多网站评选为二十款优秀游戏之一。

优点：

1. 提供了灵活的关卡编辑器，可以快速构建游戏地图
2. 提供了强大的调试工具
3. 提供了Ejecta可以将JavaScript的执行结果通过OpenGL渲染出来，可以在iOS平台上获得与原生应用相近的效率
4. 文档齐全，有两本专门介绍ImpactJS开发的书
5. 支持物理效果
6. 支持自己编写插件来扩展

缺点：
1.非开源，且中文教程极其匮乏；
2.更新慢，功能不够强大；

14、GameMaker

GameMaker与Construct 2类似，都是一个游戏制作工具，可以导出到各个平台运行，分为免费版、标准版（49.99美元）、专业版（99.99美元）和大师版（799.99美元）。其中免费版只能导出Mac和Windows版本，导出HTML5需要大师版或者专业版（再额外支付99.99美元）。

 

 

 

 

优点和缺点：
优势与Construct2类似，但性价比不如Construct2高

15、 Hilo

Hilo，一套HTML5跨终端的互动游戏解决方案开源啦！。Hilo支持了多届淘宝&天猫狂欢城等双十一大型和日常营销活动。内核极简，提供包括DOM，Canvas，Flash，WebGL等多种渲染方案，满足全终端和性能要求。

 

 

主要特性：

1. 极简内核： Hilo核心模块极精简，保留了2D游戏引擎最必要的模块，同时采用模块化管理。
2. 完善接入&扩展： Hilo 支持多种模块范式的包装版本，包括AMD，CMD，Standalone多种方式接入。另外，你可以新增和扩展需要的模块和类型。
3. 多种渲染方式：提供DOM，Canvas，Flash，WebGL等多种渲染方案，可以做到跨全端，高性能的要求。
4. 完善的周边工具：提供动画编辑器 ，Yeoman脚手架及典型案例产出的辅助开发工具。
5. 案例丰富： 支持天猫，手淘多次大型和日常活动，如双十一，年中大促等。代表产品如狂欢城。

本文参考数据来自：
1. Github
2. html5gameengine

 

本文原创：首发于DiyCode、目前被oschina、掘金头条、开发者头条、CSDN极客头条编辑推到首页。觉得好，请给我点赞，推荐，评论，帮我上博客园头条！