## 利用Object.freeze()
對于data或vuex里使用freeze凍結的對象，vue不會做getter和setter的轉換。
如果有一個巨大的數組或Object，并且確信數據不會修改，使用Object.freeze()可以讓性能大幅提升。在我的實際開發中，這種提升大約有5~10倍，倍數隨著數據量遞增。
```html
<p v-for="item in list">{{ item.value }}</p>
```
```js
new Vue({
data: {
// vue不會對list里的object做getter、setter綁定
list: Object.freeze([
{ value: 1 },
{ value: 2 }
])
},
created () {
// 界面不會有響應
this.list[0].value = 100;
// 下面兩種做法，界面都會響應
this.list = [
{ value: 100 },
{ value: 200 }
];
this.list = Object.freeze([
{ value: 100 },
{ value: 200 }
]);
}
})
```
## 首屏優化(按需模塊加載)
webpack默認將所有js源代碼打包成一個js文件，導致JS包會變得非常大，影響頁面首次加載速度。
懶加載能把不同路由對應的組件分割成不同的代碼塊，然后當路由被訪問的時候才加載對應組件的js文件。
>具體做法： 修改路由配置文件，將模塊的import代碼改寫
路由組件懶加載：
```js
// 將 import Recommend form ''components/recommend/recommend'' 改為
const Recommend = (resolve) => {
import('components/recommend/recommend').then((module) => {
resolve(module)
})
}
// 路由配置
{
path: '/recommend',
component: Recommend,
}
```
