如何解决微信小程序加载慢的问题？

如何解决微信小程序加载慢的问题？

a.提高页面加载速度:
    1. 首先用户在页面切换也就是路由跳转时,会有一个100m-300m的一个时间，我们可以利用这个时间段,预先发起新页面所需要的网络加载时间。

    2.例如从A页面预加载B页面时,我们可以通过在A页面通过this.$route的方法向B页面传递参数,B页面接收到参数之后利用我们封装好的全局put take的方法,利用缓存来进行ajax请求

   疑难:为什么我在A页面时会访问到B页面的实例呢？此时B页面不是未创建吗?

    解答:
    1.首先根据微信小程序的机制来说,在我们小程序启动时,会把所有的page()方法内的object存在一个队列中,每次页面访问时,就会创建一个新的对象实例,简单理解就是深拷贝。
    2.在我们的A页面进行点击响应事件的时候,B页面实例此时未加载,所以此时调用onload方法(onNavigate)方法时,此时this指向还是在page对象的原型,也就是小程序启动时刚创建时的那个实例。
    3.而马上被创建好的B页面此时又是另外一个obeject对象,此时this指向不是同一个对象,不能把我们临时的数据存储住,因此我们可以封装一个全局的put take缓存方法进行存储。
    4.为了通用性,我们将所有公共的方法 比如put take route都定义在了page这个基类之中,基类同时还保存了所有的list页面,这样就可以根据需求来通过onNavigate方法预加载我们的页面了。哪个页面有onNavigate方法就执行预加载,没有则不执行。

b.用户行为预测:
    1.什么是用户行为预测,就是根据用户可能点击某一个界面的机率来预先加载数据,从而实现界面秒开的效果,提高用户的浏览体验。
    2.与提高页面加载速度原理大致相同,我们需要给page对象拓展一个方法,在我们每次预载的页面之中调用这个方法,与上一个方法不同的是,本方法的临时数据会储存在storge之中,因为用户有可能不点击这个页面,而把数据全部存储在全局变量中,会影响小程序本身的内存,小程序本身一个也就支持11M的数据。

c.减少默认data的大小:
    从一个面跳转到下一个页面时,此时我们跳转后的页面会深拷贝一个page对象,所以我们为了提高性能理应减少data的体积,比如data有100个属性时,就会有一个150ms的延迟。

d.组件化方案:
    我们将一些公共的组件一个封装,在我们需要的时候来进行一个组件的调用,提高复用性,避免内存的重复占用。