vue本身存在的方法
- v-if 和v-show 的合理运用,频繁使用的组件使用v-show,不频繁的使用v-if,来减少dom的渲染
- 路由懒加载
采用()=>import(index.vue)当路由被访问的时候才回去加载
- 使用keep-alive缓存页面,减少没必要的重复渲染同时也可以减少服务器的压力
- 使用computed缓存数据,减少没必要的计算
代码方面
- 合理的的防抖节流,减少htttp的调用
- vue2中尽量不要把所有数据都放在data中,可以减少添加响应式的循环
- 图片懒加载,当图片出现在可是区域以内再去加载他
- 虚拟列表减少页面中的dom,页面中dom过多也会导致卡顿\
- 动画效果尽量在bfc中.避免影响其他元素产生回流跟重绘
- 删除console.log()避免内存泄漏
打包优化
- 可以使用webpack-bundle-analyzer,可以帮我们分析整个项目中所使用js还有第三方库的大小,然后根据这些逐步去优化
- 像体积比较大的我们可以使用cdn引入,来减少本地打包的体积
- 开启gzp压缩
- 代码分割使用 CommonsChunkPlugin SplitChunksPlugin
将代码分割成多个块,并按需加载,只加载当前页面需要的代码
