vue提升性能的幾種簡單方法

vue提升性能的幾種簡單方法:

1.vue異步組件實現懶加載
    方法如下:component:resolve=>(require([‘需要加載的路由的地址’]),resolve)
2.使用ES6中的import引入組件
3.儘量使用v-if,減少使用v-show
4.組件拆分,頁面分爲多個組件
5.使用keep-alive切換路由
6.使用vue-virtual-scroller組件加載內容過多的列表
7.v-for加唯一key
8.長列表使用this.list = Object.freeze(list);凍結數據
9.將樹形結構扁平化store數據結構,以免多次循環遞歸帶來性能開銷
10.v-for 中避免同時使用 v-if
11.圖片懶加載v-lazy
12.理解Vue的生命週期,不要造成內部泄漏,使用過後的全局變量在組件銷燬後重新置爲null
13.修改vue.config.js中的配置項,把productionSourceMap設置爲false,不然最終打包過後會生成一些map文件,並且在生成環境是可以通過map去查看到源碼的,這樣會造成源碼泄漏,這裏建議大家設置爲false。productionGzip設置爲true可以開啓gzip壓縮,使打包過後體積變小












發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章