Vue相关合集：＜系列4-Vue 项目优化的解决方案都有哪些？＞

我一般会从三个层面优化vue项目：

第一个代码层面的优化：

1.对于图片过多的页面，为了加快页面加载速度，在项目中使用 Vue 的 vue-lazyload 插件

2.对于路由过多，加载的资源过多的情况下，就把不同路由对应的组件分割成不同的代码块，使用路由懒加载

3.还可以利用keep-alive将不活动的组件缓存起来。在组件切换过程中将状态保留在内存中，防止重复渲染dom，减少加载时间及性能消耗

第二个从webpack 层面的优化：

1.在请求较大的图片资源的时候，加载会很慢，这时候我们可以用 image-webpack-loader 来压缩图片

2在打包时，可以直接把组件中的模板转换为render函数，这叫做模板预编译。这样一来，运行时就不再需要编译模板了，提高了运行效率。

第三个Web 技术层面的优化：

为了提高用户加载页面的速度，会对静态资源进行缓存