HTML5游戏引擎（一）-egret引擎简介——一个开源免费的游戏框架

为什么

• 游戏行业发展迅速， 给程序员提供了大量就业 (斗鱼， 微派， 腾讯， 蓝月， 网易 等等)
• 游戏开发薪资普遍比较高 (王者荣耀 ， 蓝月)
• 游戏已经普遍被大众所认可，并且发展成一种竞技体育

学习目标

• 重点学习Egret
• Typescrit 语法学习
• 一笔带过Cocos2d-x

Egret跨平台，入手容易，性能较好，更新频繁，辅助开发工具较多，团队合作更加得心应手。

Cocos2d-x 最开始的时候主打跨平台使用C++开发较多, 后来才兼容的js。虽然发展的时间很长，但是BUG偏多，性能不如Egret。

历史总是向前发展的，cocos2D 和 Egret就好比angular1 和 React，我们总是选择思想更先进，社区更繁荣的框架。

第一章 Egret简介

何为HTML5游戏？

仿CF枪战h5网页游戏——http://localwar.xidayun.com/

技术角度

从早期的像素的游戏( 俄罗斯方块 )，到小霸王游戏机（魂斗罗），到2D游戏 （ 传奇， DNF， 冒险岛， LOL ），3D游戏 （CF, 吃鸡）。玩家越来越被精美的画面，精美的特效所吸引。

传统的游戏绝大多数使用C++编写完成，借助GPU来提升游戏画面的品质和渲染性能。很多游戏都会依赖于游戏引擎开发。

• Creation引擎，代表作：《上古卷轴5：天际》和《辐射》
• Unreal Engine（虚幻引擎），代表作：《战争机器》,《绝地求生》等等
• Frostbite Engine（寒霜引擎），代表作：《荣誉勋章》和《战地》。

这些游戏都运行在各自的平台上，比如： ps4, switch, windows PC等等。

而HTML5可以让游戏运行在浏览器。

特点：

• 跨平台 （pc, 安卓， ios）
• 点开即玩，适合小快灵的游戏 ( 跳一跳， 斗地主， 麻将 等 )
• 画质和体验不及传统游戏(性能， 加载速度， 画质)

非技术角度

传统游戏需要exe文件进行解压安装，或者 买光盘进行游戏。

但是html5游戏，你只需要得到一个URL地址就可以愉快的进行游戏了。

为什么需要游戏引擎？

几年前，很多前端开发者尝试使用Canvas来制作游戏，甚至有的开发者使用DIV来开发游戏，体验可想而知。

因为在当时并没有一款真正意义上的游戏引擎，很多的所谓的"HTML5游戏引擎", 实际上仅仅是一个渲染框架。

真正的游戏需要考虑很多问题：

• 渲染
• 网络 (延迟)
• 音频
• 碰撞检测

而Egret提供了大量的工具帮我们解决这些问题。

Egret介绍

egret官网——https://www.egret.com/

cocos官网——https://www.cocos.com/

Egret引擎是一个开源免费的游戏框架，用于构建二维游戏、演示程序和其他图形界面交互应用等。Egret使用TypeScript脚本语言开发。当游戏完成最终的打包后，可以将程序转换为HTML5游戏。实现跨平台特性。

Egret不仅仅是一个基于HTML5技术的游戏引擎，我们的产品线中除了Egret引擎还提供了很多辅助游戏开发的工具。**准确的来说，Egret是一套游戏开发的解决方案。**你可以使用Egret引擎来帮助你开发HTML5游戏，并运行在手机和PC端的浏览器中，同时也你可以使用Egret提供的相关工具搭建你自己的游戏开发工作流。

开源免费

基于BSD开源协议的Egret引擎，可以自由的使用Egret来创作自己的游戏。

1.BSD开源协议是一个给于使用者很大自由的协议。基本上使用者可以”为所欲为”，可以自由
的使用，修改源代码，也可以将修改后的代码作为开源或者专有软件再发布。

2.Apache Licence是著名的非盈利开源组织Apache采用的协议。该协议和BSD类似，同样
鼓励代码共享和尊重原作者的著作权，同样允许代码修改，再发布(作为开源或商业软件)。需要满足
的条件也和BSD类似。

3.GPL协议的主要内容是只要在一个软件中使用(”使用”指类库引用，修改后的代码或者衍生代
码)GPL协议的产品，则该软件产品必须也采用GPL协议，既必须也是开源和免费。(代表： linux)

优秀的设计思想

Egret的设计思想大量借鉴了优秀的2D动画软件Flash的一些设计思想。在引擎的设计中，Egret底层使用了弹性跑道模型，显示列表，脏矩阵，事件模型等技术。在这些技术基础之上，我们封装了对用户极为友好的API。开发者在开发游戏时，无需考虑底层渲染逻辑，只关心游戏逻辑即可。

高效的渲染模块

在图形图像渲染中，Egret完全使用HTML5标准中的canvas技术。极大程度上保证了使用Egret引擎开发的游戏在各个浏览器上的兼容性。同时，为了给玩家更好的游戏体验，我们不仅仅提供了CPU渲染，还提供了性能更为强大的硬件加速渲染模式。该模式无需开发者自动开启，引擎会根据当前用户硬件类型智能判断启用。

完善的配套工具

Egret引擎的设计宗旨始终围绕在简化游戏开发上，用户在使用Egret的时候，能够体会到，所有的引擎设计全部围绕游戏开发。同时Egret提供的配套工具也极大简化了游戏开发流程。从游戏的代码编写，UI制作，地图拼接，关卡制作到最终游戏上线，研发过程中都有大量工具支撑。

灵活的工作流

Egret不限制开发工具的使用，我们也为一些优秀的第三方工具提供了相关插件。让用户在不改变开发习惯的情况下无缝迁移到Egret。

社区支持

Egret为用户建立了用户社区，如果在使用Egret过程中遇到了哪些问题，可以直接在用户社区中得到答案。同时，我们也为用户提供了大量文档手册，方便用户学习。

https://bbs.egret.com/portal.php

功能

Egret继承了Flash的优点，同时更加针对游戏开发，主要包括如下功能：

• 显示列表：清晰、稳健、高效的视觉抽象结构
• 精灵：一种轻量级显示容器
• 事件机制：提供了一套生成和处理事件消息的标准方法
• 纹理集合：将大量图片汇集为一张纹理图进行处理
• 矢量绘图：封装了方便简单的矢量绘图功能
• 网络加载：封装了常用的网络通讯协议
• 位图字体：可通过位图字体方式显示文本
• 性能监控：可在游戏中快速开启性能监控面板
• 反射：对TypeScript增加了反射机制，方便模块化开发
• XML处理：提供标准的XML格式解析生成功能
• 骨骼动画：支持业内最优骨骼动画解决方案DragonBones
• 资源加载：提供了整套资源加载方案，优化网络加载功能
• EUI：提供大量组件，可快速开发游戏中的UI控件
  Script增加了反射机制，方便模块化开发
• XML处理：提供标准的XML格式解析生成功能
• 骨骼动画：支持业内最优骨骼动画解决方案DragonBones
• 资源加载：提供了整套资源加载方案，优化网络加载功能
• EUI：提供大量组件，可快速开发游戏中的UI控件