对于一个项目来说，代码开发是从无到有的一个环节，优化是让项目走向成熟的一个过程。好了，开始吧1.代码优化（开发者的基本素养）1.减少不必要的代码，高内聚低耦合，对公共组件提多次复用2.在for循环中设置key值，利用Diff的特性3，vue路由在首屏渲染时设置为延迟加载，可以加快渲染速度。有时我们希望将某个路由下的所有组件打包在同一个异步chunk中。只需使用命名块，一种特殊的注释语法来提供块名称（需要Webpack>2.4）。constFoo=()=>import(/*webpackChunkName:"group-foo"*/'./Foo.vue')网上有统计请求时间的：在路由配置文件中，这里引用组件在路由器.js。如果使用同步方式加载组件，首屏加载时会加载较多的网络资源，资源比较多，加载速度比较慢。所以设置路由的懒加载和按需加载会加快首屏的渲染速度。当路由没有懒加载时，可以在Chrome的devtool中查看首屏网络资源的加载情况（6requests3.8MBtransferredFinish:4.67sDOMContentLoaded2.61sLoad2.70s）。延迟加载路由后（7requests800kb转Finish2.67sDOMContentLoaded1.72sLoad800ms），可以看到加载速度明显加快。但是懒加载之后，实现了按需加载，那么项目打包就不会把所有的js都打包到app.[hash].js里面了优点：就是减少js的体积缺点：如果项目太大，你开发环境中需要取消lazy加载的效果，因为拆分多个请求会增加请求数，开发时经常刷新影响开发效率4.异步组件在需要的时候加载（因为配合webpack打包来优化效果）5.更好地理解Vue的生命周期。无用的组件需要销毁。6、合理使用keep-alive处理初始化问题，以免影响业务功能。流式防抖防止触发或执行不必要的请求和方法9.无状态组件被标记为功能组件10.合理使用计算属性的依赖缓存提高读取效率2.非代码优化1.修改vue.config.js为(webpack)中的配置项，设置productionSourceMap为false(减少不必要的代码被打包)而不生成.map文件。webpack默认会生成一个地图文件。映射文件用于调试代码，并将productionSourceMap设置为false。另外，这里要注意，sourcemap的配置分为开发（dev）和线上（build）两个地方。我们不关心开发并使用默认的。我们在线不需要此代码。2.利用cdn对外加载一些资源https://blog.csdn.net/weixin_...我比较喜欢别人的解释https://blog.csdn.net/xiangzh...两个一起看不错，哈哈哈哈加载平衡，最快的方式获取公共包，写一个备份包，也就是你本地的文件，CDN失效时，避免报错3.减少图片（sprite和压缩图片）的使用，请美工4.SSR(服务端渲染)服务端渲染减轻了前端渲染的负担5.骨架屏加载指标并不能治本，反而提升了用户体验6.图片的延迟加载页面使用vue-lazyload库图片过多，为了加快页面加载速度，所以很多时候我们需要先不加载页面可见区域没有出现的图片，滚动到可见区域后再加载。这将大大提高页面加载性能，同时也改善了用户体验。总结：文章以vue为例，同样适用于其他框架。如何实现不是最重要的，最重要的是思路~ok接下来会继续更新。..
