vue性能优化（1）

1.<keep-alive></keep-alive>,接收include，exclude，max三个值，可以缓存组件状态，避免组件的重新渲染，exclude的优先级大于include，max为可缓存组件数目的最大值，超过会调用最近最少使用算法

2.组件懒加载

Vue.component('Home',function(resolve){

reuqire(['./home'],resolve)

})

Vue.component('Home',()=>import('./home'))

3.路由懒加载

export default new Router({

routes:[

{path:"/",

component:()=>import('/home')

},

{

path:'/index',

component:resolve=>require(['/List'],resolve)

]})

4.图片懒加载

下载vue插件vue-lazyload

import Vue from 'vue'
import VueLazyload from 'vue-lazyload'

Vue.use(VueLazyload, {
  error: '/static/error.png',
  loading: '/static/loading.gif',// 懒加载使用的图片
})

<img v-lazy="xx.jpg"/>