微信小游戏开发入门：示例代码介绍

什么是微信小游戏？

看前几天的科技新闻，微信中的“跳一跳”小游戏从去年12月发布，截至到今年3月份已经积累了3.9亿玩家，这是一个多么恐怖的数字，“跳一跳”游戏带火了整个微信小游戏开发圈。微信小游戏是个什么东西呢？

参考一下万能的百度百科：

微信小游戏是基于微信客户端的游戏，它即点即玩，无需下载安装，体验轻便，可以和微信内的好友一起玩，比如PK、围观等，享受小游戏带来的乐趣。微信小游戏不是一场革命，过去传统的重度手机游戏依然有其生存空间，微信小游戏既不需要下载安装包，又有合格的流畅性，是更适合休闲类游戏生长的土壤。

关于发展前景：未来的微信小游戏将是广告（高活跃）和虚拟道具（高收入）齐头并进的局面，在前期主要先做高活跃，等小游戏这个平台发展壮大，再发力高收入的游戏。

技术架构

微信小程序技术架构

上面这张图说明微信小游戏的技术架构，通俗的说微信在自己Ａｐｐ里做了一个支持Ｈ５的浏览器内核（也可以叫一种容器），但是功能受到了一些限制。不支持 HTML 标签的解析、及 CSS 和 DOM 的解析。Ｈ５容器做的最主要事情，就是从操作系统的 Objective-C, Java, C++ API 上开始写起，里面实现自己的逻辑，然后架上安卓 v8、苹果 JavaScriptCore 等 JavaScript 虚拟机（JSVM），进而把这些操作系统 API 都绑定到 JavaScript 上。

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

从技术角度来说，微信小游戏是微信小程序的基础上添加了游戏库 API。小游戏只能运行在小程序环境中，所以小游戏既不是原生游戏，也不完全等同于 HTML5 游戏。但实际上小游戏面向的就是 HTML5 游戏开发者，为了能够让 HTML5 游戏可以尽可能低成本得移植，小游戏尽可能复用了 WebGL、JavaScript 等源自浏览器的 HTML5 技术。

可以说小游戏是使用 HTML5 技术搭建，具有原生体验的微信内游戏产品。小游戏保留了H5中游戏相关的技术，而在此基础上又追加了小程序部分特性能力。

这样出来的游戏，技术更专注、特点更微信。

与普通页面上运行H5游戏有什么不同

微信中Ｈ５浏览器内核容器的方案和 HTML5 标准是两码事，但又有共通之处。比如小游戏封装出的 OpenGL JavaScript API，和 WebGL 是一模一样的，这就让游戏的移植工作量大幅降低。只是覆盖掉了这些差异性，让开发者「感觉」自己就是用普通的游戏引擎在开发一款 HTML5 游戏，确实也能在 Chrome 里面做调试。但如果你一旦使用了既超出引擎 API、又超出微信游戏容器 API，但是符合 HTML5 标准的代码，比如来个 CSS，来个 DOM，那么就无法运行在小游戏里面啦。

微信小游戏不是纯H5环境，可以理解为定制修改过的浏览器，把延伸功能、渲染、存储用JS脚本绑定上来，所以说小游戏实际运行在Runtime环境中，而开发中的调试环境主要是网页浏览器，它们的内存和性能限制不一样，所以要尽早跑在手机上，尽量暴露潜在问题。

微信小游戏只支持JavaScript语言，当然可以编译为JS的TypeScript和CoffeeScript也可以作为开发语言使用