今天來談一談vue中一些效能優化的問題，僅僅是個人使用中的一些小心得，來，今天我一句廢話不多說，直接上內容好吧
1.v-if和v-show的使用，
我們都知道這兩個都可以控制顯隱，那我們用哪個呢，個人覺得要從兩個方面入手來確定使用哪個，
1.許可權的問題，只要涉及到許可權相關的展示用v-if比較好
2.切換地頻率，如果頻繁的切換我們用v-show，不頻繁的切換用v-if
其實兩者各有優缺，就看你是怎麼選擇了，用v-if能減少頁面中的dom總數，加快渲染的速度，而且我們要清楚乙個事情
v-if是'真正的'條件渲染,因為它會確保在切換過程中條件塊內的事件***和子元件適當地被銷毀和重建.
v-if也是惰性的,如果在初始渲染時條件為假,那麼什麼都不做- - 直到條件第一次為真的時候才會開始渲染條件塊,相比之下,v-show
就簡單得多- - 不管初始條件是什麼,元素總會被渲染,並且只是簡單的基於css進行切換.
2.使用動畫時可以用css啟動硬體加速，
css animations, transforms 以及 transitions 不會自動開啟gpu加速，而是由瀏覽器的緩慢的軟體渲染引擎來執行,那我們怎樣才可以切換到gpu模式呢，很多瀏覽器提供了某些觸發 的css規則，可以用transform: translatez(0); 來開啟硬體加速，transform: translate3d(0, 0, 0)也可以。
3.元件懶載入，
這個很有用的，例如，當我們在乙個很長的頁面時，使用者可能只會去看前一兩屏，那剩下沒被用使用者**的元件也會被載入，這樣就會浪費我們的資源，我們使用元件懶載入在阻止效能浪費
4.為item設定唯一key值，
方便vuex的內部機制在迴圈時能夠準確的找到該條列表資料
5.減少watch的資料，在有可能的前提下，減少沒有必要的state資料
因為當watch的資料比較大的時候，會大量消耗效能，所以我們可以使用事件**匯流排或者vuex進行資料的變更操作
為什麼要減少沒有必要的state資料，這和vue的響應式原理有關，vue會使用 object.defineproperty 把這些屬性全部轉為 getter/setter ,並建立相應的watcher來監控，這就造成乙個問題，當我們的state特別多時，對應的watcher也就會特別多，容易造成卡頓，這也是為什麼在大型專案（狀態特別多）我們會選用react而不用vue的原因
6.按需載入，這個算是基礎操作了吧
7.ssr（服務端渲染）
如果專案比較大，首屏無論怎麼做優化，都出現閃屏或者一陣黑屏的情況。可以考慮使用ssr(服務端渲染)
8.骨架屏載入
在頁面載入資源較多，可能會出現白屏和閃屏的情況，體驗不好，這個時候我們可以使用骨架屏
（骨架屏就是在頁面內容未載入完成的時候，先使用一些圖形進行佔位，待內容載入完成之後再把它替換掉）
9.打包時的優化
有時候我們打完包之後發現包會很大，那怎麼解決這個問題呢，其實很簡單，在專案中，我們不是引入了諸如axios，vuex，vue-router等的包嗎，那我們將這些包剔除出去，
換用cdn直接引入到我們專案的根目錄的html當中，
注意在 webpack 裡有個 externals配置，可以忽略不需要打包的庫
Vue效能優化
而正是這種做法引發了效能問題，要初始化乙個父元件，必然需要先初始化它的子元件，而子元件又有它自己的子元件。那麼要初始化根標籤，就需要從底層開始冒泡，將頁面所有元件都初始化完。所以我們的頁面會在所有元件都初始化完才開始顯示。這個結果顯然不是我們要的，更好的結果是頁面可以從上到下按順序流式渲染，這樣可能...
Vue效能優化
1 我們可以直接在data函式return之前直接this.的方式掛在例項上,在methods中還可以訪問,但是又不會觸發響應式跟蹤 改寫後變成這樣 data 2 v if和v show if根本不會渲染該元素，所以某些想藏起來的htlm元素盡量用v if 而一些可能通過不同切換來實現顯隱的就可以用...
vue效能優化
通常在元件使用前，需要引入後再註冊，但如果高頻元件多了後，每次都這樣做，不僅新增很多 效率還低！我們應該如何優化呢？global.js檔案 import vue from vue function changestr str const requirecomponent require.contex...