长列表性能优化

在2.x版本中Vue会通过Object.defineProperty对数据进行劫持, 以实现双向数据绑定. 但在一些特定的业务场景, 组件只需要进行纯数据展示, 不会有任何变化, 此时我们可能不需要Vue对来数据进行劫持. 在大量数据需要进行呈现时, 如果禁止Vue对数据进行劫持, 会明显减少组件初始化的时间.

1
export default {
2
  data: () => ({
3
    userList: []
4
  }),
5
  async created() {
6
    const userList = await this.$service.get("/getuserList");
7
    this.userList = Object.freeze(userList);
8
  }
9
};
Copied!
使用Object.freeze后，Vue的双向数据绑定实效，这也就是带来性能提升的原因。

以前

基础知识

下一个

mixin

最近更新 2yr ago

复制链接