重拾H5小游戏之引擎篇（一）

前言

游戏电玩，是孩童们的挚爱。无论是上世纪70、80、90年代的中青年，还是本世纪的00、10后的少年儿童而言，都有同电子游戏一起的回忆。

当然，我本人也不例外。而且，早年也曾从事游戏行业。虽然当年混得不怎么样，现在也不混游戏圈好多年了，但是想写点“重拾游戏开发”系列的文章还是可以滴。关键我又找到“重拾”的理由了！

事情要从2019年末，席全国的“新冠病毒”说起。大瘟疫导致2020年整个社会摆停了一个多月，至今还没完全恢复。原本2月中旬开学的小学生们，只能待在家里“停课不停学”。于是，任课老师投来很多学习课件，让孩子在家自学。其中数学老师的课件深得我娃的喜爱，于是娃给他爹我布置了个任务——把老师的课件演示内容做成小游戏给他玩。

于是……

游戏引擎

工欲善其事必先利其器

应付孩子而已，犯不着花时间裸写游戏引擎框架，因此必定要借别人的肩膀站一站。Google一下，看看最近H5游戏流行什么引擎框架。由于本人一贯对TypeScript的迷恋，搜索关键词：typescript game development。

1.Excalibur.js
第一个映入眼帘的是叫 Excalibur.js的引擎。github上600多个star，API不太多，简单轻量级，想必够用了。虽然名字带了js的后缀，但这却是纯ts的项目。

于是，我把源码down下来，对着文档撸了一个下午，游戏在PC端跑起来了。然而，移植到手机端问题就来了！显示对象的点击出问题：安卓机上，一次点击触发了两次pointdown的事件回调；iOS机器上，点击直接无效。oh，no！这才意识到踩到坑里去了。

没时间填坑，无奈，该引擎只能止步于此了。

2.Phaser3
好吧，只能换一个。既然Google搜索不科普，那就搜索一下当年记忆。以前用过cocos、白鹭，有种杀鸡有牛刀的感觉，用这些大引擎还要装上一个全家桶开发工具包，好麻烦！其实我只需要一个开箱即用的轻量级易上手的东西而已……

对了，以前好像我还测试过一个叫Phaser的H5游戏引擎，似乎也还可以。于是打开其官网。这么多年过去，这个引擎还在。有用于TypeScript的d.ts，而且GitHub的star竟然高达26.8K，牛逼闪闪的存在啊！就它了！

结果，代码撸下来，找到写当年写AS3的那种非常顺畅的感觉，场景切换组件封装都很容易上手。而且不像Excalibur只有Canvas，它支持WebGL和Canvas两种渲染模式智能切换，所以对PC和移动双端的兼容自然是冇问题了！

总之，换了Phaser之后，我的游戏就顺利完成了。我在半天时间里，到底做了个怎样的小游戏？欲知后事如何且听下回分解，反正这篇算是水完了：）