对于Vue的响应式大家应该都有所了解，通过getter和setter来实现数据的订阅和分发。我们在实际使用中可能会遇到这样一个场景，就是Vue组件的data部分的数据会非常多，可能数据来到了数千上万条甚至是十来万，这时页面会变得非常卡顿。关于Vue的性能优化中有这样一条：复杂(数据庞大或结构复杂)的对象数据不要放在Data中，这是因为Vue对深度遍历data独享的属性并依次添加getter和setter，以此达到响应式的目的。既然知道原因就好做了，我们可以根据这个问题给出三种解决方案：

1. 将数据不在data中定义，而是通过从created之后在动态的在钩子函数中定义数据变量。因为在created之前包括created都是Vue对数据的一些处理，如果我们在DOM是挂载之前或者挂载完毕后在钩子函数中动态的定义一个变量去保存我们想要的复杂数据，这个时候就不会Vue就不会对该数据进行递归响应式了。
2. 使用Object.freeze对数据进行冻结，避免Vue对数据进行响应式处理。
3. 在组件实例外定义数据，以模块的私有变量去定义变量，不过该方式可能造成内存泄露，需要谨慎使用。

这里对第三条进行一个示例：

let options={...}; 复杂数据
export default {
  data() {
    return {};
  },
  methods:{
   let tempGrid = options.grid.split(0,26);
  }
 }