随着项目的不断迭代，项目中的代码量也在不断的攀升，直到有一天我们猛然发现项目中的页面并不是十分的多，也没怎么发现项目中有那么多的复杂的业务逻辑，但是本地代码量已经破10M了。 我当时接手的时候就有一种很魔幻的感觉，于是向leader申请做一次代码精简，并提前向产品，ui沟通好，需要他来协助我这次的工作。 主要步骤如下：
- 跨部门
- 和产品沟通，删除冗余页面及其引用
- 和ui沟通，将图片替换为svg格式或压缩后放到图床
- 部门内
- 推进使用原子化css
- 与团队商量规范，并约定共同遵守
1. 删除冗余页面及其引用
和产品沟通，配合开发者工具代码依赖分析，删除项目中的冗余页面及其引用
这一步过后，本地的代码体积就已经有了很明显的改观，虽说对于能上线的体积并无影响，但是对于后续的维护有很大的益处
2. 将图片替换为svg格式或压缩后放到图床
整理项目中的图片，与ui沟通，将这些图片能处理为svg的就替换为svg，不能的就通过 tinypng 压缩 ，并将其放到公司的图床上
备注：tinypng 网站上的压缩最好多压缩一次，通常情况下来说大点的图片第二次压缩的时候还能再减少至少十几kb的大小
完成上面两个步骤之后，无论是本地的项目体积还是上传之后的体积都会有大幅度的下降，非常的直观，高效
上面两步是跨部门的，主要是沟通好，毕竟占用他们的时间并不是很多，
接下来就是部门内的操作了，难度要稍微大一些了，因为接下来的操作相当于给同事增加工作量，要多协调
3. 使用原子化css
在使用原子化css之前，聊一聊为什么要用它
在网络上，普遍的回答是去除重复代码，以全局css的形式来取代页面或组件内的css。
但是对我来说这只是其一。
在日常的开发中，我们不难发现，随着项目的不断迭代，废弃的html片段或js函数，大家绝大多数情况下会将其删除或注释掉，但是对于废弃的css，大家基本上是不闻不问，这就导致了有些页面内容没多少，但是css几百行，毕竟后续来维护的也不知道之前的css到底还用不用，通常都是在最下面新开一行继续进行开发。
为了改善这种情况，要分两步走：
- 逐步的删除页面上用不到的css
- 使用windicss，逐步的取代掉以前的css
我们注意到，上面两步都用到了逐步，为什么要这么说呢，我们分析一下这个操作对于各方的利弊就知道了
- 对于领导来说，肯定是不希望因为我的这次操作影响了工期，毕竟优化这个东西并不能带来实际的利益
- 对于同事而言，增加了他们的工作量，并且这个工作量完全没有技术含量，纯纯的搬砖行为
- 对于我而言，这些事情我一个人过于费时费力，并且因为改动很多，测试那边也并不乐意
综上，我们就在版本迭代的时候，去修改涉及到的页面即可，这样一来工作量就大大的减少了， 影响面也就被锁定住了，后续大家按照约定就好了
4. 与团队商量规范，并约定共同遵守
这一步就是与团队成员的约定，约定一些大家都遵守的规范就行，毕竟规范制定的再好再完美，没人执行也是白搭， 在工期不赶的情况下，做一下 code review ，大家慢慢的就一致起来了
