一澜建、代碼
（1）使用Object.freeze()凍結(jié)不需要響應(yīng)式變化的數(shù)據(jù)
原理：將configurable: 改為false送矩，就不會被劫持了蚕甥。
（2）防抖和節(jié)流
防抖：
// 回調(diào)函數(shù)
function searchName(name) {
console.log('name=====', name)
}
// // 防抖函數(shù)
function debounce(func, delay) {
let timer = null
return function(content) {
if(timer) {
clearTimeout(timer)
}
timer = setTimeout(() => {
func(content)
}, delay)
}
}
let debounce1 = debounce(searchName, 1000)
let input = document.getElementById("search")
input.addEventListener('keyup', function(e) {
debounce1(e.target.value)
})
節(jié)流
// 節(jié)流就是高頻次觸發(fā)哪替，間隔相同的時間執(zhí)行一次栋荸，技能冷卻，
// 沒有計時器就可以執(zhí)行
// 一開始沒有計時器凭舶， 可以執(zhí)行一次晌块，執(zhí)行完開始計時 生成一個5秒計時器， 5秒后把他自己cleartimeout掉
function jieliu(fn, delay) {
let timer;
return function() {
if(!timer) {
fn(content);
timer = setTimeout(()=>{
clearTimeout(timer)
timer = null
},500)
}
}
}
（3）圖片大小壓縮&懶加載：
壓縮：使用image-webpack-loader 進行壓縮帅霜，
懶加載：引入第三方包vue-lazyload
// main.js引入
import VueLazyload from 'vue-lazyload'
Vue.use(VueLazyload, {
error: 'dist/error.png',
loading: 'dist/loading.gif',
attempt: 1,
})
（3）按需引入餓了么ui
安裝使用babel-plugin-component包匆背，在.babellrc文件中設(shè)置libraryName：element-ui
(4)路由懶加載
使用import()方法進行組件的引入
(5) 虛擬列表：
vue3中使用的是 vue-virtual-scroller
(6)事件委托
(7) 圖片上傳壓縮
(8)生產(chǎn)環(huán)境關(guān)閉sourcemap
