2019-05-06、刚从国外回家，最近压力特别大、不过还是要扛住，没有过不去的坎、让生活再艰难一点，天将降大任于斯人也！
不扯了，想记录一下自己之前如何做的前端性能优化和项目重构！
- 背景：当时去了另一个项目部赶项目，没人管！！！
先改业务代码，因为这是我们关注的，相比于业务工具是次要的！然后再去修改工具，提升开发效率和质量！
项目可以优化的两个方向：项目架构、业务代码
首屏性能优化
性能不佳不仅仅是前端导致，也有后端的问题
不详细说了，大致记录下
改
1、【代码切割】import() es8、TC39委员会将import() 提到了stage3阶段，放心使用
2、【图片png换icon-font】减少浏览器并发请求
3、【js放到body后加载】有埋点的js文件在head中加载了
4、【接口合并】：一共调用了12个接口，有的权限相关的接口合并为一个接口，有的地方接口重复调用了
5、【坎掉需求】：坎一个接口，后端请求一个接口非常慢，点击轮播、查询当前用户如何跳转，轮播本身点击率不高，这个需求砍掉；还砍掉了一个温馨提示的弹窗，原先版本是针对工资条使用的，但后来项目拓展，工资条只是其中一小部分
6、【移除lodash】
7、【cdn加载】静态资源放cdn加载
8、【单独加载静态资源库】使用externals，不去打包react、react-dom、react-route-dom等，可以减小打包的bundle.js
9、【展示数据存localhost】在真实数据返回前先获取之前的数据展示，增强用户体验，async、await
10、【react挂载前加载loading】增强用户体验
11、【createProtal】避免重绘/重排
架构上
1、【各种库升级】webpack升级4等
2、【ui库统一】同时存在dingui和antd
3、【水印js库】存放npm、其它项目也有使用到
4、【报错监控】img发起请求
5、【数据监控】
