15个最好的开源JavaScript游戏引擎推荐

本文概述

15. Backbone Game Engine
14. DarlingJS
13. JawsJS
12. Enchant.js
11. Quintus
10. Panda Engine
9. Crafty
8. Stage.js
7. qiciengine
6. Kiwi.js
5. MelonJS
4. Pixi.js
3. PlayCanvas WebGL游戏引擎
2. Babylon.js
1. Phaser.js

尽管问题是” Javascript速度慢吗？” 这是一个非常主观的问题, 因为它运行在客户端的浏览器上, 所以它完全取决于运行javascript代码的硬件和软件。但是, 这是怎么回事？现代浏览器具有我们5或10年前从未想过的功能。通过利用JavaScript API WebGL, 他们可以完全渲染复杂的2D和3D图形, 而无需依赖第三方浏览器插件。我们只想凸显Javascript可用于网络游戏开发！不只是2D游戏, 还有3D游戏。从纯JavaScript入手是获得扎实的网络游戏开发知识的最佳方法。
但是, 如果我们可以加速这一过程, 为什么还要重新创建轮子以从0开始构建游戏(设计控件, 资产操纵, 关注优化以及很多可能需要花费大量时间自行解决的无尽问题)使用用Java编写的游戏引擎？我们认为, 在本文中, 我们将介绍用于Web游戏开发的最佳Javascript游戏引擎。
15. Backbone Game Engine 【15个最好的开源JavaScript游戏引擎推荐】Github

文章图片
Backbone Game Engine是基于Backbone构建的基本HTML5 Canvas游戏引擎。专为2D平台游戏者而设计, 并针对移动设备进行了优化。 Backbone Game Engine被编写为可在CocoonJS Canvas +内部运行, 因此你可以将HTML5游戏变成iOS或Android上的本机应用程序。

建立在骨干上。事件, 模型, 集合, 继承和RESTful持久性。为什么要重新发明轮子？
仅HTML5画布。没有jQuery, 尽可能少的DOM操作。
移动优化。可以在具有透明触摸和视口支持的移动设备上运行。一切都针对每秒最大帧数(FPS)进行了优化。

14. DarlingJS Github

文章图片
DarlingJS是基于组件和实体的JavaScript游戏引擎, 具有依赖项注入和模块化体系结构。 Darling.js不花一毛钱。根据简化的BSD许可获得许可的代码。你只需要在源代码中注明你已使用Darling.js。如果你让我知道你在项目中使用引擎, 我将非常高兴。
Darling.js中的依赖项注入使你可以声明性地描述应用程序的连接方式。而且, 任何不符合你需求的组件都可以轻松更换。将功能和数据分离为大部分彼此独立的单独的系统和组件。因此, 使用组合代替继承。还要在可插入游戏应用程序的模块中对组件和系统进行分组。
13. JawsJS Github

文章图片
Jaws是由HTML5驱动的2D游戏库。它最初只是做画布, 现在也通过相同的API支持基于DOM的普通精灵。
Jaws非常适合” 经典” 侧面/顶部滚动游戏(基于或不基于瓷砖的), 在这些游戏中, 你具有大量的由精灵板动画的精灵。下颌带有基本的rect-vs-rect / circle-vs-circle碰撞检测功能, 在大多数情况下都可以正常工作。如果你有大量的精灵(例如, 子弹般的地狱炸弹), 则可能要使用Box2D之类的Physicallib或四叉树之类的空间散列来加快速度。下巴使用画布使像素完美碰撞和蠕虫式地形相对易于开发。如果你的游戏的GUI非常繁重, 则可能需要基于纯HTML元素而不是canvas子画面来创建游戏。
12. Enchant.js Github

文章图片
一个简单的JavaScript框架, 用于创建具有以下功能的游戏和应用程序：

是用于使用HTML5 + JavaScript开发简单游戏和应用程序的框架
于2011年发布, 但已经发布了1, 000多种游戏和应用程序
是开源的(MIT许可证), 因此可以免费使用
有广泛的支持文档：API文档, 出版物, 教程站点
可以添加各种插件来增强功能
由UEI秋叶原研究中心的成员不断开发和维护

11. Quintus Github

文章图片
Quintus是一款易于学习, 易于使用的JavaScript HTML5游戏引擎, 适用于移动设备, 台式机以及其他设备。
Quintus引擎是一个HTML5游戏引擎, 设计为模块化, 轻巧的, 简洁的JavaScript友好语法。作为尝试将标准的OOP游戏引擎结构塞入HTML5 JavaScript引擎的替代方法, Quintus借鉴了jQuery的一些提示, 并提供了插件, 事件和选择器语法。除了传统继承之外, Quintus还提供了灵活的组件模型, 而不是仅使用单一继承的深层模型, 从而使重用功能以及在游戏和对象之间共享功能更加容易。
10. Panda Engine Github |例子

文章图片
Panda Engine是一款免费的HTML5游戏引擎, 具有Canvas和WebGL渲染功能, 可用于移动设备和桌面设备, 它使用Pixi.js进行超快渲染。
借助Panda Engine, 你可以跟踪游戏中的Google Analytics(分析)事件以及其他有趣的功能。
9. Crafty Github

文章图片
Crafty是一个JavaScript游戏库, 可以帮助你以结构化方式创建具有以下功能的游戏：

实体和组件-一种干净且分离的方式来组织游戏元素。无需继承！
事件绑定-用于自定义事件的事件系统, 可以随时随地触发并轻松绑定。
无需dom操作或自定义绘图例程。

其他商品：

蓬勃发展的社区-论坛中提供了帮助。
社区模块-你可以使用的用户生成的代码不断增长。
纯JavaScript-没有魔术。在所有主流浏览器中均可使用, 并可与你最喜欢的js库结合使用。

8. Stage.js Github |例子

文章图片
Stage.js是一个用于跨平台游戏开发的2D HTML5 JavaScript库, 它轻巧, 快速且开源。
Stage.js提供了一个类似于DOM的树数据模型来组合你的应用程序, 并在内部管理应用程序的渲染周期和绘图, 它还处理鼠标事件和触摸事件并将其分发到目标树节点。
Stage.js应用程序由一棵节点树组成。每个节点都固定(变换)在其父节点上, 并具有零个, 一个或多个图像纹理。每个渲染周期都包含刻度和绘制树节点。勾选时, 节点将自己调整为最新更新, 然后在绘制时, 每个节点根据其固定进行变换并绘制其纹理。渲染将保留并在没有更改的情况下暂停。
7. qiciengine Github |例子

文章图片
Qiciengine是一个免费的JavaScript游戏引擎库, 其中包含用于制作HTML5游戏的基于Web的综合工具集。 QICI Engine基于免费和开放源代码HTML5游戏框架Phaser, 该框架使用Pixi.js进行桌面和移动Web浏览器的WebGL和Canvas渲染。
使用QICI Engine, 创建HTML5游戏就像开发网站, 使用你喜欢的代码编辑器, 使用你喜欢的Web浏览器, 利用JavaScript语言和所有最佳Web开发工具一样容易。 QICI Engine负责解决基础技术的复杂性, 因此你只需专注于重要的事情即可制作游戏！
QICI Engine由三部分组成：QICI Core, QICI Widget和QICI Editor：

QICI Core：一个基于Phaser的JavaScript游戏引擎库。
QICI Widget：一个用于创建丰富应用程序的JavaScript UI库。
QICI编辑器：一个基于Web的编辑器, 带有一个Node.js服务器, 用于加速HTML5游戏开发。

6. Kiwi.js Github |例子

文章图片
Kiwi.js是一个有趣且友好的开源HTML5游戏引擎, 有人将其称为HTML5游戏引擎的WordPress。
Kiwi.js是世界上最易于使用的开源HTML5游戏框架, 可用于制作移动和桌面HTML5浏览器游戏。他们的重点是极快的WebGL渲染和补充工具, 以制作专业质量的严肃游戏。他们使用CocoonJS发行游戏和创建应用程序。
你的游戏可以同时针对canvas和WebGL。对于较旧的浏览器和大多数移动浏览器, 请使用画布。将WebGL用于最新的浏览器, 并与Cocoon.js结合使用以构建快速的本机移动应用程序。你可以使用CocoonJS和Chrome WebStore等平台轻松高效地为iOS, Android和Chrome应用制作游戏。
5. MelonJS Github |例

文章图片
melonJS是一个轻量级但功能强大的HTML5框架, 它是从头开始设计的, 旨在提供真正的无插件” 一次写入, 随处运行” 的面向游戏的库。 melonJS是一个开源项目, 并得到了爱好者社区的支持。 Melon JS支持当前功能：

清新轻巧的2D Sprite引擎
独立库(除了支持HTML5的浏览器外, 不依赖其他任何库)
与大多数主流浏览器(Chrome, Safari, Firefox, Opera, IE)和移动设备兼容
设备运动和加速度计支持
高DPI和自动缩放
支持的设备上的多通道HTML5音频支持和Web音频
轻巧的物理实现可确保较低的cpu要求
基于多边形(SAT)的碰撞算法可实现准确的检测和响应
使用空间分割的快速广相碰撞检测
第三方工具支持物理实体定义(PhysicEditor, Physic Body Editor)
用于向量和矩阵的高级数学API
补间效果
过渡效果
基本的对象实体集(待扩展)
对象池
基本粒子系统
基本动画管理
支持标准Spritesheet和压缩纹理(Texture Packer, ShoeBox)
状态管理器(轻松管理加载, 菜单, 选项, 游戏中状态)
平铺地图格式版本+ 0.9.x集成, 便于进行关卡设计
- 未压缩的Plain, Base64, CSV和JSON编码的XML tilemap加载
- 正交, 等轴测和透视图贴图支持
- 多层(多个背景/前景, 碰撞和图像层)
- 多个Tileset支持
- Tileset透明度设置
- 图层Alpha设置
- 矩形, 椭圆形, 多边形和折线对象支持
- 平铺对象
- 翻转和旋转瓷砖
- 动态层和对象/组排序
- 动态实体加载
- 基于形状的图块碰撞支持
系统和位图字体
鼠标和触摸设备支持(带有鼠标仿真)
对CocoonJS和Ejecta的内置支持
异步消息支持(minPubSub)
包括基本的GUI元素
可定制的装载机

4. Pixi.js Github |例子

文章图片
Pixi.js是超快速的HTML 5 2D渲染引擎, 它使用带画布后备功能的webGL。该项目的目的是提供一种适用于所有设备的快速轻量级2D库。 Pixi渲染器使每个人都可以享受硬件加速的强大功能, 而无需WebGL的先验知识。而且, 它很快。真快。
Pixi.js具有完整的WebGL支持, 并在需要时无缝地退回到HTML5的画布。作为一个框架, Pixi.js是用于编写交互式内容的绝佳工具, 尤其是近年来随着Adobe Flash的退出。将其用于图形丰富的交互式网站, 应用程序和HTML5游戏。开箱即用的跨平台兼容性和优雅降级意味着你要做的工作更少, 并且做起来会更有趣！如果你想相对快速地创建优美而精致的体验, 而又不必钻研密集的低级代码, 同时又避免了浏览器不一致的麻烦, 那么可以在下一个项目中添加一些Pixi.js魔术。
3. PlayCanvas WebGL游戏引擎 Github |例子

文章图片
PlayCanvas是一个开源游戏引擎。它使用HTML5和WebGL在所有现代浏览器中运行游戏和其他交互式3D内容, 而无需插件。

图形
- 基于WebGL的3D渲染器
- 基于物理的渲染(PBR)
- 定向灯, 点光源和聚光灯(所有这些都可以投射阴影)
- 运行时光照贴图烘焙
- 静态和蒙皮网格
- 带编辑器的GPU粒子引擎
- PostFX库：Bloom, 边缘检测, FXAA, 小插图等
- Maya, 3DS Max, Blender等的无缝默认材质支持。
- Maya, 3DS Max, Blender等通过《资产用户手册》提供的完整模型导出管道
碰撞与物理
- 与3D刚体物理引擎ammo.js完全集成
音讯
- 通过Web Audio API进行3D定位音频
资源加载
- 简单而强大的资源加载
- 流动个人资产
- 资产变体-基于平台支持加载压缩纹理(DXT, PVR, ETC1)
实体/组件系统
- 内置组件：模型, 声音, 动画, 摄像机, 碰撞, 灯光, 刚体, 脚本, 粒子系统
脚本系统
- 通过将JavaScript附加到游戏实体来编写游戏行为
- 实时代码热交换可实现快速迭代
输入
- 鼠标, 键盘, 触摸, 游戏手柄支持, VR

2. Babylon.js Github |讲解

文章图片
Babylon.js是一个开放源代码的JavaScript框架, 你可以通过它在WebGL, HTML5和Web Audio的帮助下在浏览器中构建和渲染3D游戏。虽然在原始WebGL中绘制简单的3D对象需要你处理大量的JavaScript代码, 但是Babylon.js可以使你以最少的代码量和非常低的复杂度执行相同的操作。
由于其强大的功能, Babylon.js可以称为” 另外Thre??e.js” , 它使你能够在浏览器中创建几乎所有内容, 从完全交互式的3D游戏到动画徽标。尽管此JavaScript框架目前尚处于初期阶段, 但即使它为开发人员提供了可用于几乎所有地方的功能丰富的WebGL创作的坚实基础。
1. Phaser.js Github |例子

文章图片
但是, 请稍等一下, Phaser.js比Babylon.js更好, 这是在开玩笑吗？你知道人们怎么说, 一个人的肉是另一个人的毒药。你可能不希望开始使用WebGL等先进技术来开发Web游戏, 因为你很快就会感到沮丧, 因为创建游戏并不容易。在那儿, Phaser.js可能会是你从游戏开发开始的首选, 因为它非常易于使用, 它们提供了很多示例, 并且不需要很多代码库即可创建你的第一个游戏。
Phaser是一个有趣, 免费且快速的2D游戏框架, 用于为桌面和移动Web浏览器制作HTML5游戏, 支持Canvas和WebGL渲染。 Phaser在内部使用Canvas和WebGL渲染器, 并可以基于浏览器支持在它们之间自动交换。这样可以实现跨台式机和移动设备的快速闪电渲染。 Phaser使用并贡献了出色的Pixi.js库进行渲染。
Phaser已用于创建数百个游戏, 每月接收数百万次播放。而版本2是迄今为止最稳定且没有错误的版本。这些问题很快得到解决, 我们始终处于不断变化的浏览器格局之首。
如果你认为我们忘记了另一个用Java编写的出色游戏引擎, 请在评论框中告知我们并与社区分享。