在微信 6.6.1 版本中，给用户推送了“玩一个小游戏才是正经事”的首屏小游戏入口，一时间整个朋友圈都在跳一跳。相信很多游戏开发者心痒难耐，想一探究竟。

一、微信小游戏开发的必备知识点

之前提到，小游戏的开发主要复用了 HTML5 技术栈，所以开发过 HTML5 游戏的开发者上手会快很多，甚至很多 HTML5 游戏都可以很快移植到小游戏平台。具体来说，微信小游戏的开发技术分为三个部分。

1. 底层技术

首先是开发语言，都可以作为开发语言使用。

其次是小游戏所支持的游戏库 API，主要包含 HTML5 的 Canvas 2D API 和 WebGL 1.0 API，使用任何一种 API 都可以完成游戏最重要的渲染功能，不过不能够混用，除此之外，只有 WebGL 渲染模式可以支持 3D 渲染。

2. 中间件：游戏引擎

当然，直接使用 Canvas 2D 或 WebGL 来制作游戏是门槛很高，也非常费时费力的一件事，你肯定不希望一个小游戏项目拖上一年半载吧？所以使用 HTML5 游戏引擎其实是非常明智的选择，引擎封装出的高层接口可以大大降低开发者的开发门槛，缩短项目周期。目前国内的三家主流引擎 Cocos Creator、Egret、Laya 均已支持小游戏发布，Phaser.js、Three.js 等国外 HTML5 引擎虽然并没有支持直接发布，经过一些定制也是可以成功运行在小游戏环境中。

3. 微信 SDK

除此之外，微信小游戏还提供了丰富的微信内部 SDK 供开发者调用，使用这些接口可以完成用户登陆、转发、排行榜等常规的社交功能。

不过除了这些常规玩法以外，最让人欣喜的是通过转发小游戏，可以完成玩家在游戏中的组队或对战，加上小游戏即点即玩的特点，这种邀战的游戏体验可以说是天衣无缝。

二、API 之下：理解小游戏的底层技术架构

小游戏的运行环境其实是微信的原生环境，游戏的 JavaScript 代码并不是通过浏览器来执行的，而是通过JS VM 层独立的 JavaScript 引擎来执行的。 在 Android 平台使用 Google 的 v8 引擎，而在 iOS 上则使用苹果的 JavaScript Core 引擎。

当然 JS 引擎只负责解释执行 JS 逻辑，并没有支持渲染接口，那么渲染接口和诸多的微信功能接口又是怎么实现的呢？这就不得不提到脚本绑定技术，这种技术可以将某种原生语言的接口桥接到脚本接口上，当在脚本层调用接口时，会自动转发到原生层，调用原生接口。微信小游戏环境用的就是这样的技术，将 iOS / Android 原生平台实现的渲染、用户、网络、音视频等接口绑定为 JavaScript 接口。这也就是图中的微信原生层模块到小游戏层模块的原理。脚本绑定技术无法在这篇文章中深入探讨，如果大家有兴趣，可以去了解 Cocos Creator 的 JSB 绑定实现，这也是游戏引擎中唯一一家完全开源的绑定技术实现。

小游戏在有了这样一套框架之后，HTML5 游戏在移植过程中仍然是会遇到无数 API 兼容性问题，最简单的比如 document 对象不存在，Image 对象不存在。为了降低移植成本，微信团队提供了一个 Adapter 脚本，适配了一部分浏览器接口。

浏览器渲染接口浏览器 Adapter微信服务 SDK值得一提的是，Adapter 脚本已经不再继续维护了，所以额外的接口适配都需要开发者自己完成，而依赖于 DOM 接口的大多数功能都是无法适配到小游戏环境中的。

刚刚也提到推荐大家使用游戏引擎去开发小游戏，小游戏环境的基础之上，游戏引擎不仅封装了高层接口，还尽力抹平了浏览器与小游戏环境之间的差异。

总结游戏引擎为开发者所做的工作，包含下面几个方面：

Framework：高层 API 封装对于游戏开发更便利；

资源加载适配；

事件处理适配；

音频播放适配；

窗口适配；

输入框适配；

添加其他缺失的接口，比如增加 DOM Parser 用于解析 TileMap。

EDITOR：优化程序-美术-策划的协同效率；

优秀的游戏编辑器可以大幅缩短开发周期。

GENERAL：优秀的游戏引擎提供高设备兼容性，稳定的运行性能；

跨平台游戏引擎提供无缝发布 HTML5、小游戏、原生平台的强大能力。

高效率的编辑器带来开发成本的降低；低入门门槛降低了人力成本；高兼容性和稳定的性能降低维护成本；跨平台/渠道带来强大的流量获取能力。对于开发者来说，这些就是生存和盈利的保障！

三、上手调试小游戏

1.微信小游戏配置和入口文件

在微信小游戏项目中，project.config.json 和 game.json 配置文件是大家首先需要添加的，其中 project.config.json 可以定义你的小游戏 appid、游戏名、配置等。而 game.json 主要用于指定游戏朝向和网络超时时间。

另外，小游戏不支持任何 html 文件，入口文件是 game.js，你需要启动的引擎和游戏脚本都应当在 game.js 中用 require 函数引入，require 函数的用法遵循 node.js 的 require 规范。

2. 编译和预览

微信开发者工具会自动监听脚本和配置的变动，发生变动时会自动更新，你也可以通过顶部的编译按钮触发重新编译。当你需要在手机上预览小游戏的效果时，需要点击预览按钮来生成二维码，扫码即可进入小游戏。生成二维码的过程实际上是在压缩和上传小游戏包到微信 CDN 上，所以会花费一些时间。

3. 详情配置

详情配置中包含一些重要的配置选项，包括：

调试基础库：小游戏应该选择 game；ES6 转 ES5：是否将 ES6 脚本转换为 ES5；代码上传时自动压缩：是否压缩脚本；不校验安全域名、TLS 版本以及 HTTPS 证书：当你在本地测试，或通过非正式域名测试时，需要开启这个选项才能够正常访问你的服务器。

四、市场展望

最后我们从市场上来看，其实小游戏青睐的 HTML5 技术栈蕴含着巨大的机遇，目前使用 JavaScript 支持跨平台的游戏引擎已经不少。以 Cocos Creator 为例，编写一套游戏代码，可以在编辑器中无缝发布 HTML5 手机页游、PC 页游、手机原生游戏、小游戏。我们可以简单计算一下，根据 12 月初伽马数据的行业报告，国内 2017 年手机原生游戏 1162 亿，PC 端游 648 亿，PC 页游 156 亿，所以按比例简单计算的话，手机页游的市场空间 = 1162 ÷ 648 x 156 = 每年 280 亿人民币。

如果进一步考虑 Flash 宣布 2020 年停更，市面大量 PC 页游都开始转用 HTML5 技术制作，而手机原生上也出现了大量的微端产品，那么如果不考虑此消彼长的制约， HTML5 技术可以支撑的游戏市场规模应该 = 280 亿 手机页游 + 156 亿 PC 页游 + 部分手机原生游戏 ≈ 每年 500 亿人民币。

500 亿人民币还只是计算国内的规模。根据国外 Newzoo 在年中的数据，中国游戏产业规模占全球 25%，那么 HTML5 技术理论上可以支撑的全球手机页游、手机原生、PC 页游市场容量上限可达每年 2000 亿人民币。

所以，掌握 HTML5 技术栈，掌握微信小游戏、QQ 厘米秀、Facebook Instant Games 等「手机页游」新平台上的社交游戏开发技术，洞悉这些社交平台上的用户特点、和提出针对性的游戏设计，对于想进入这个领域的游戏开发商而言，是近期迫在眉睫的事。

而且目前普遍的观点是，在资本的推动下，手机页游的时间窗口应该只有 1~1.5 年，这里面会有原生游戏大厂布局成功的，也会有新晋的研发商和发行商。而在游戏行业产生这样的风口，平均 5 年左右才能有一次。

微信小程序开发公司:www.c5c6.cn