HTML5游戏引擎深度测评.docx

HTML5游戏引擎深度测评最近看到网上一篇文章，标题叫做《2016年 最火的 15 款 HTML5 游戏引擎》。目前针对HTML5游戏的解决方案已经非常多，但谁好谁差却没有对比性资料。特意花了几天时间，针对文章中出现的12款免费开源引擎做了一次相对完整的对比分析，希望能对大家有所帮助。针对技术类产品对比，通常有多个维度进行对比，不仅仅是技术层面，还有许多非技术层面的内容会影响我们的使用结果。本文从如下几个维度进行多重对比。2D与3D编程语言设计理念功能工作流性能学习资料商业应用2D与3D、编程语言对比2D与3D游戏领域中，最直白的一种分类方法便是2D与3D的区分。通常我们都会认为它们是游戏引擎领域两类不同的产品。原文中提及的引擎确实是当下最为流行的HTML5游戏引擎。很多引擎属于2D、3D通吃类型，我们通过一个表格进行对比。编程语言基于HTML5技术的游戏引擎，所需要的脚本必定是JavaScript，只有JavaScript脚本语言才能运行于浏览器中。但目前市场上，出现了很多JavaScript代替品，例如TypeScript、CoffeeScript、LiveScript等等。不同语言直接的定位不同，语言哲学也不尽相同。一些游戏引擎在语言选择上也颇有意思。Engine2D Render3D RenderJavaScriptTypeScriptThree.jsNOYESYESNOPhaserYESNOYESYESPixi.jsYESNOYESYESEgretYESYESYESYESenchant.jsYESNOYESNOcraftyJSYESNOYESNOTurbulenzYESYESYESYEScocos2d-jsYESNOYESNOPlayCanvasNOYESYESNOmelonJSYESNOYESNOQuintusYESNOYESNOHiloYESNOYESNO结论可以从表格中看出，下面三个引擎属于2D和3D通吃类型。EgretTurbulenzPlayCanvas在Web游戏领域胜出的编程语言是JavaScript和TypeScript。但绝大部分HTML5游戏引擎还是采用JavaScript语言。只有4款引擎选择支持TypeScript。从当前前端技术圈环境分析，未来可能很多前端框架或者引擎会推出响应的TypeScript语言分支，从AngularJS宣布将使用TypeScript开发开始，TypeScript在很大程度上被前端认可。不得不说微软在开源圈这一仗打得漂亮。设计理念功能架构设计是一门大学问，对于开源引擎架构的设计模式主要取决于作者的程序哲学观点和产品定位。将设计思路和功能放在一起对比讨论，比单独功能讨论更有参考意义。一个引擎的功能并非越多越好，功能应围绕引擎定位而定，这样的思路在一些引擎中体现尤为明显，下面我们针对每个引擎一一分析。Three.js定位Three.js项目创建时间是在2010年的4月24日，到目前位置，应该算是比较老牌的开源项目了。事实上Three.js定义并非一个游戏引擎。在Github主页中，作者很明确的定义了Three.js的定位，叫做“JavaScript 3D library”。它仅仅是一个基于JavaScript语言的3D库而已。当然，你可以用它来做任何事情，无论是游戏，还是炫酷的3D展示。设计理念Three.js在设计之处希望创建一个非常轻量级的3D库，能够帮助开发者快速搭建基于HTML5的3D内容。同时，通过暴露简单的API，将3D内容的开发复杂性降至最低。渲染环境上，Three.js支持WebGL和CCS3D两种渲染模式。从当前使用量和标准普及程度来做分析看，开发者更加倾向于WebGL渲染方式。功能文本主要想对2D游戏引擎做深入分析，所有没有对Three.js的功能与那些流行的3D引擎加以对比。Pixi.js定位很多人第一眼看到Pixi.js官网，都会不自觉的认为这是一款游戏引擎。但在主页中作者对于Pixi.js的定义为“2D WebGL renderer with canvas fallback”，翻译为中文是一款依赖于canvas的WebGL渲染器。所以当你看到Pixi.js提供了为数不多的功能时，请不要惊讶，因为它只是一款渲染器。设计理念Pixi.js的设计理念很多程度来源于它的定位，只做渲染器，要把渲染功能做到最强。而这样的定位，则会让Pixi.js成为其他引擎的渲染内核。你经常能看到一些游戏引擎，或者产品都基于Pixi.js而开发。最求极致的渲染性能是Pixi.js的首要任务，为了让Pixi.js更加易于使用，作者在API设计上更加参考非常成熟的2D渲染架构 —— Flash，并且提供的API也尽量参考了ActionScript。例如创建一个显示对象，在Pix