Vue项目优化【一】

引子

如果一个项目，经过了若干个开发者的手，没有文档，没有规范，那注定是一个悲剧。
本项目正是如此。

过程

第一版，PHP输出页面，以jQuery为页面框架，单个页面内部嵌入Vue，形成独立的多页面。
第二版，取消多页面，用统一的Vue包裹外层，构造SPA项目。
第三版，剥离PHP，使用构建工具，引入npm管理，构造真正的SPA。

思考

其实到了这一步，项目已经可以说是一个Vue项目。
但是，还有几个问题需要解决。
第一，有些文件是冗余的，但是没有删除。当然，这并不影响项目的开发和运行。
第二，有些方法和变量多次引用，多次赋值，多次实现，造成了代码冗余和管理不便。
第三，绝大部分数据没有做缓存，路由切换的时候重复请求，或者同一个数据在多个页面重复请求，影响效率。
第四，逻辑控制太多，且不做注释，导致维护困难。
第五，同样的需求，差异极小，多次实现，影响开发和维护效率。
第六，首屏加载极慢，项目启动极慢，可以尝试做懒加载，减少相互依赖。

对策

1、冗余文件删除。
2、抽离公共方法，公共变量。
3、请求数据做缓存，单独实现一个缓存机制，实现原理，根据请求的URL和params，存入缓存，下次请求到这个数据的时候，直接从缓存读取。可以传递一个参数，是否需要实时数据，目前来说，大部分数据不需要实时数据。
4、某些差异极小的功能，做要做到单独模块，修改的时候只引用改模块，而该模块代码独立，减少干扰。
5、加载优化。

结语

具体效果需要优化完才知道！