近期，由于工作需要，开发了一系列H5小游戏。它们最初是使用原生画布开发的，但开发效率相对较低。 Duosi虽然可以灵活定义，比如滤镜处理、渐变等。但是整体开发速度较慢游戏动态，很多时候不能满足实际开发需求。后来逐渐接触到国内的Layabox和国外的PIXI、Phaser框架。当然3d里面还有three.js和babylon。这些是比较常用的H5游戏框架。而且这些框架都比较容易使用。鉴于跨平台和手机兼容性问题，我一般使用Phaser和layabox，它们的兼容性都不错。 Phaser的游戏音效模块做的不错，兼容大部分手机，游戏结构中很多东西都封装的很好，支持js和Ts，比较好用。 Layabox 内容涉及广泛的 2d 和 3d 支持音乐，性能也不错。 Phaser 目前只能自支持 2d 游戏，还没有 3d 支持。对了，我用的是PhaserCe，phaser3目前正在更新完善中，很多地方会出现兼容性问题。但是以后肯定会好的。当然，使用这两个框架的原因是用它们制作的游戏可以很容易地转化为微信小游戏。 Laya可以直接开发微信小游戏，Phaser需要很多准备。给大家推荐一个网站：“phaser station”游戏开发 教程，一个很不错的网站，大家有时间可以看看。有时间我会把我在游戏开发中学到的东西写下来，做成系列教程。
每个游戏都将使用 LayaBox 和 Phaser 框架为每个人演示。使用的语言是打字稿。为什么直接使用 typescript 而不是 js？原因是typescript开发效率会很高，调试也简单，结构清晰。最重要的是它自动转换的js比我们自己写的js好很多倍。所以配置开发环境，果断使用typescript！
作为第一篇游戏开发 教程，我们来说说屏幕适配。 Phaser 使用设备像素，layabox 使用物理像素。简单来说，phaser游戏中的图片大小不能太大，否则需要进行缩放，但是layabox图片的大小取决于设备的物理像素。例如
phaser和layabox中相同图像宽度的图像的区别如下。让我们自己看看具体的像素概念！像素和物理像素的区别，所以游戏设计必须考虑帧的选择和材质的大小以及适配的方法。
