小程序利用本地緩存提前渲染頁面

進入小程序，如果數據是從服務器獲取的話，用戶需要等待一段時間，期間可能顯示的是白屏或者loading動畫，爲了提升用戶體驗，可以利用緩存提前渲染數據，減少用戶的等待時間。

優化前：

Page({
  onLoad: function() {
    wx.request({
      url: 'https://test.com/getproductlist',
      success: res => {
        if (res.statusCode === 200) {
          list = res.data.list
          this.setData({
            list: list
          })
        }
      }
    })
  }
})

優化後：

Page({
  onLoad: function() {
    var list = wx.getStorageSync("list")
    if (list) { // 本地如果有緩存列表，提前渲染
      this.setData({
        list: list
      })
    }

    wx.request({
      url: 'https://test.com/getproductlist',
      success: res => {
        if (res.statusCode === 200) {
          list = res.data.list
          this.setData({ // 再次渲染列表
            list: list
          })
          wx.setStorageSync("list",list) // 覆蓋緩存數據
        }
      }
    })
  }
})