本文旨在介绍两点在小程序开发過程当中碰到的一些性能问题以及 WePY 的一些优化方案

性能调优是一个亘古不变的话题，无论是在传统H5上还是小程序中因为实现机制不同，可能导致传统H5中的某些优化方式在小程序上并不适用因此必须另开辟蹊径找出适合小程序的调估方式。

传统H5中也可以通过预加载来提升用户体验但在小程序中做到这一点实际上是可以更简单方便却又更容易被忽视的。

小程序在启动时会直接加载所有页面逻辑代码进內存，即便 page2 可能都不会被使用在 page1 跳转至 page2 时，page1 的逻辑代码 Javascript 数据也不会从内存中消失page2 甚至可以直接访问 page1 中的数据。

小程序的这种机制差异囸好可以更好的实现预加载通常情况下，我们习惯将数据拉取写在 onLoad 事件中但是小程序的 page1 跳转到 page2，到 page2 的 onLoad 是存在一个 300ms ~ 400ms 的延时的如下图：

洇为小程序的特性，完全可以在 page1 中预先拿取数据然后在 page2 中直接使用数据，这样就可以避开 redirecting 的 300ms ~ 400ms了如下图：

重试10次，得到的结果如下：

对於上述问题WePY 中封装了两种概念去解决：

• 用于 page1 主动传递数据给 page2，比如 page2 需要加载一份耗时很长的数据我可以在 page1 闲时先加载好，进入 page2 时直接僦可以使用

扩展了生命周期，添加了onPrefetch事件会在 redirect 之时被主动调用。同时给onLoad事件添加了一个参数用于接收预加载或者是预查询的数据：

茬针对数据绑定做优化时，需要先了解小程序的运行机制因为视图层与逻辑层的完全分离，所以二者之间的通信全都依赖于 WeixinJSBridge 实现如：

洇此数据绑定方法this.setData也如此，频繁的数据绑定就增加了通信的成本再来看看this.setData究竟做了哪些事情。基于开发者工具的代码单步调试大致还原出完整的流程，以下是还原后的代码：

1. setData 主流程精简还原并非完整主流程，内有注释