Vue中常見的性能優化


1. 不要將所有的數據都放到 data 中,data 中的數據都會增加 getter 和 setter,又會收集watcher,這樣還占內存。不需要響應式的數據我們可以定義在實例上。

2.在 v-for 綁定事件的時候可以使用事件代理,將事件綁定到外層元素上。

3. 使用 keep-alive 緩存組件,防止組件來回的創建和銷毀這樣浪費性能。

4.使用 v-show 代替 v-if 指令。

5. key 最好保證唯一性,提高 DOM-diff 的復用性能。

6. 合理的使用路由懶加載,異步組件。

7.localStorage,sessionStorage。

8.預渲染插件 prerender-spa-plugin

打包優化:

1)使用 cdn 加載第三方模塊

2)多線程打包 happypack

3)splitChunks 抽離公共文件

4)sourceMap 生成源碼映射

5)壓縮和緩存


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM