小游戏，只所以为小，因为它的体积确实小，下载起来快，随用随走。

在微信小游戏中， 游戏包体大小是有限制的，首包是4M，分包的话，在cocoscrator中，也只能分包js文件，所以，图片文件还是只能通过远程加载。但是，creator构建出来的图片资源，会一次性被小游戏加载回来，这样，就会造成小游戏在加载图片资源时，会有黑屏，资源过大时，黑屏时间就更长。所以，这时候使用手动动态加载大图，可以有效的减少初始化游戏时的网络压力。

下面通过以下几个方法，来优化我们的游戏

1、手动加载超大图

将游戏中使用到的大图（超过50kb的），采用低分辨率小图作为初始图，然后在节点onLoad以后，采用cc.loader.load() 方法,来动态加载原图。 这样既不会造成初始没有图，也可以展示更清晰的原图。
more >>

• observe

• observer

• observable

• action

• action.bound

• computed

mobx

一个状态管理工具 简单、可扩展

• Observable state(可观察的状态)
  MobX 为现有的数据结构(如对象，数组和类实例)添加了可观察的功能。 通过使用 @observable 装饰器(ES.Next)来给你的类属性添加注解就可以简单地完成这一切。

• Computed values(计算值)
  使用 MobX， 你可以定义在相关数据发生变化时自动更新的值。 通过@computed 装饰器或者利用 (extend)Observable 时调用 的getter / setter 函数来进行使用。(当然，这里也可以再次使用 decorate 来替代 @ 语法)。

• Reactions(反应)
  Reactions 和计算值很像，但它不是产生一个新的值，而是会产生一些副作用，比如打印到控制台、网络请求、递增地更新 React 组件树以修补DOM、等等。 简而言之，reactions 在 响应式编程和命令式编程之间建立沟通的桥梁。

• Actions(动作)

微信公众号验证签名失败 invalid signature

最近做一个h5的小游戏，需要用到微信的分享。要调用微信的分享， 就要用到微信公众号。 首先要后端提供一个验证签名的接口

1、假设后端接口下来了。
2、前端要调用的话， 必须是在获取签名以后， 拿到签名信息，再调用微信的config接口具体代码：

事件监听

在cocosCreator中，是以组件的方式开发的，事件也是基于组件来监听和触发
事件处理是在节点（cc.Node）中完成的。对于组件，可以通过访问节点 this.node 来注册和监听事件。监听事件可以 通过 this.node.on() 函数来注册，
more >>

本地存储

cocos中的本地存储sys.localStorage其实也就是widow对象下的localStorage
源代码位置
more >>

Widget: 定位适应组件，看不见摸不着,可以帮助我们固定某个组件离父元素的位置

UI组件有好多好多，这里暂时用到这么多，其它的实践使用了再写

• ProgressBar:进度条

  会有一个子组件bar
  主要设置progress的大小(0~1)，就可以设置进度

cocos creator开发游戏

开发一个简单的游戏，都有哪些组成部分呢？

• 1、场景
  游戏主要是由场景组成的，不同的场景转表示不能的展示。 场景中都有一个根元素，Canvas。 一般开发的时候，场景的大小就是canvas的大小，也就是用户可以看到的范围，会将一些图片、文字资源都放置到这个canvas下面。排在上面的显示在前面。

• 2、脚本
  JavaScript脚本主要是来控制游戏逻辑的。 more >>

开放数据域

是一个封闭、独立的 JavaScript 作用域。要让代码运行在开放数据域，需要在 game.json 中添加配置项 openDataContext 指定开放数据域的代码目录。添加该配置项表示小游戏启用了开放数据域，这将会导致一些 限制。

主域和开放数据域的通信

开发数据域，需要有一个单独的目录， 并且和主域下的模块不能相互引用。 只能通过message的形式通信。

• 主域调用开放域

  主域可以向开放数据域发送消息。调用 wx.getOpenDataContext() 方法可以获取开放数据域实例，调用实例上的 OpenDataContext.postMessage() 方法可以向开放数据域发送消息。

  1 2 3 4 5 6

  // game.js let openDataContext = wx.getOpenDataContext() openDataContext.postMessage({ text: 'hello', year: (new Date()).getFullYear() })

  在开放数据域中通过 wx.onMessage() 方法可以监听从主域发来的消息。

  1 2 3 4 5 6 7 8

  // src/myOpenDataContext/index.js wx.onMessage(data => { console.log(data) /* { text: 'hello', year: 2018 } */ })

开放域不能主动向主域发消息

限制
当小游戏启动开放数据域，即在 game.json 中添加 openDataContext 配置项时。小游戏环境会对主域和开放数据域应用一些限制。

主域

• sharedCanvas 只能被绘制到上屏 canvas 上。
• 上屏 canvas 不能调用 toDataURL，其 context 不能调用 getImageData。
• sharedCanvas 不能调用 toDataURL 和 getContext。
• 不能将上屏 canvas 和 sharedCanvas 以任意形式绘制到其他 canvas 上，包括 drawImage、createPattern、texImage2D、texSubImage2D。

限制功能

开放数据域只能调用有限的 API，如下所示：

• 帧率

requestAnimationFrame()
cancelAnimationFrame()

• Timer

setTimeout()
clearTimeout()
setInterval()
clearInterval()

• 触摸事件

  1 2 3 4 5 6 7 8

  wx.onTouchStart() wx.onTouchMove() wx.onTouchEnd() wx.onTouchCancel() wx.offTouchStart() wx.offTouchMove() wx.offTouchEnd() wx.offTouchCancel()

• 画布

wx.createCanvas()

开放数据域的所有 canvas 只支持 2d 渲染模式

• 图片

wx.createImage()

• 开放数据

1
2
3
4
5

wx.getFriendCloudStorage()
wx.getGroupCloudStorage()
wx.getUserCloudStorage()
wx.setUserCloudStorage()
wx.removeUserCloudStorage()

• 监听主域消息

wx.onMessage()

渲染类接口

wx.createCanvas 最基础的创建canvas对象