微信小程序性能优化总结

Posted 2021-06-29 yw00yw

渲染性能优化

setData优化

不过于频繁调用setData，将多次setData合并成一次调用

// 不要频繁调用setData
this.setData({ a: 1 })
this.setData({ b: 2 })
// 绝大多数时候可优化为
this.setData({ a: 1, b: 2 })

与界面渲染无关的数据最好不要设置在data中，可以考虑设置在page对象的其他字段下

/**
 * 生命周期函数--监听页面加载
 */
onLoad: function (options) {
  // 不要设置不在界面渲染时使用的数据，并将界面无关的数据放在data外
  this.setData({
    myData: {
      a: '这个字符串在WXML中用到了',
      b: '这个字符串未在WXML中用到，而且它很长…………………………'
    }
  })
  // 可以优化为
  this.setData({
    'myData.a': '这个字符串在WXML中用到了'
  })
  this._myData = {
    b: '这个字符串未在WXML中用到，而且它很长…………………………'
  }
},

/**
 * 生命周期函数--监听页面初次渲染完成
 */
onReady: function () {
  console.log(this._myData);
},