按需引入
匯入『element』類似元件時，不要整個匯入使用，只需要匯入使用的元件
論元件的復用性：全域性元件與區域性元件
在專案中無論vue，react都會存在元件復用性問題，這裡主要說在vue中的說明
全域性元件：在main.js進行全域性註冊元件，達到其他元件可以無需再次註冊可直接使用
優點：無需重複註冊
缺點：每次重新整理都會載入元件，增加載入消耗
適應場景：訊息提示，使用頻率高
區域性元件：在需要使用的地方註冊並使用
優點：只會在呼叫的地方重新整理才會載入，減少載入消耗
缺點：每次使用都需要重新註冊
適應場景：使用頻率一般較少
import modal from "@/components/modal.vue";
.component("modal", modal)
new
webpack.optimize.uglifyjsplugin(,
sourcemap:
false})
vue中在vue.config中
productionsourcemap:
false
,//其中sourcemap: false是禁用除錯功能。
//如果設為true，在部署包中會生成.map結尾的js檔案。它用於在**混淆壓縮的情況下仍可進行除錯。
//這個功能雖好，但會大大增加整體資源包的體積，所以將其禁用。
方式1
import vue from
'vue'
import router from
'vue-router'
// import helloworld from '@/components/helloworld'
vue.
use(router)
export
default
newrouter(]
})
在index.html中匯入***資源
>
<
/div>
"">
<
/script>
"">
<
/script>
"">
<
/script>
<
/body>
module.exports =
, externals:
// import vue from 'vue'
// import vue-router from 'vue-router'
等檔案會分別由乙個執行緒進行載入。且因為使用了cdn，減輕了頻寬壓力
v-once只渲染元素和元件一次。隨後的重新渲染，元素/元件及其所有的子節點將被視為靜態內容並跳過。這可以用於優化更新效能
v-cloak當載入緩慢時可能出現顯示vue原始碼的情況}，可以使標籤載入完成前保持隱藏狀態
keep-alive用於快取元件，tabs元件中就可以適用，減少渲染
VUE專案效能優化（VUE10）
1.不要講所有的資料都放在data中，data中的資料都會增加getter和setter，會收集對應的watcher 2.v if和v for不能連用 3.vue在使用v for給每項元素繫結事件時使用事件 4.spa 頁面採用keep alive快取元件 5.v if當值為false時內部指令不再...
webpack打包vue專案效能優化
專案打包上線設定productionsourcemap為false減小.map檔案所佔dist檔案的體積 開啟gzip對dist檔案進一步壓縮 ps 需後端配合開啟gzip方可使用 使用cdn減小打包後vendor.js的體積，從而縮短首屏載入時間 ps 第3步如果注釋掉出現錯誤可以不進行注釋 按需...
Vue效能優化
而正是這種做法引發了效能問題，要初始化乙個父元件，必然需要先初始化它的子元件，而子元件又有它自己的子元件。那麼要初始化根標籤，就需要從底層開始冒泡，將頁面所有元件都初始化完。所以我們的頁面會在所有元件都初始化完才開始顯示。這個結果顯然不是我們要的，更好的結果是頁面可以從上到下按順序流式渲染，這樣可能...