性能优化清单
1、性能量化指标（Chrome DevTools、performancer api、waterfall、lighthouse、Coverage）
2、webpack 打包优化（参考webpack 优化清单）
3、nginx gzip压缩
4、静态资源优化
- 图片大小优化（tinypng）图片格式优化（webp）；
- 静态资源部署到其他域名下（浏览器同域名http1.x请求并发数-chrome=6、同域名会携带不必要的cookie）；
- 静态资源合理利用缓存；
- 静态资源放到CDN服务器；
5、页面按需加载（react-loadable、react.lazy）、三方npm包按需加载（antd、lodash）
6、避免回流和重绘
7、骨架图
参考
webpack 优化清单
1、构建时间优化
- 并行构建（HappyPack、ThreadLoader）；
- 提前构建第三方库（DllPlugin）；
- 缩小文件搜索范围（include、exclude、resolve）；
- HMR热模块替换（devServer hot）；
2、构建体积优化
- 代码分割按需加载（splitChunks）；
- 删除冗余代码（TreeShaking）；
- 代码压缩（minify、css、js）；
- 作用域提升（Scope Hoisting）；
3、开发体验优化
- 自动刷新（Dev-Server）；
- 提高调试体验（sourcemap）；
4、构建可视化工具
- 测量各阶段构建时间（speed-measure-webpack-plugin）
- 分析打包内容（ webpack-bundle-analyzer）
参考链接
- zhuanlan.zhihu.com/p/150731200
- segmentfault.com/a/119000001…
- webpack摇树优化 segmentfault.com/a/119000001…
前端团队规范清单
1、参考并定制相关的文件规范、代码规范等
2、配置 eslint
3、配置 prettier
4、约束配置 commitlint
5、git commit时执行 prettier writer、eslint fix、commitlint
6、约束版本号规范（语义化版本（SemVer）和日历版本）,上线后记得打tag
7、前端的关键环境变量团队保持统一，如node 12.13.0
8、使用sonarQube嗅探工程异味
git message 规范清单
1、推荐使用命令行提交代码（诸多好处）
2、代码提交格式-fn(范围)：中文描述
- fn: fix feat refactor test chore 必填：现阶段只用这5个 bug修复、新功能、优化重构、测试用例、日常开发
- 范围： 公用的业务或者模块名称 选填; 如 登录 班级 消息
3、约定git分支命名规范及合并规范
4、可使用commitlint校验git 提交规范
前端跨域实现清单
1、浏览器的安全规则（同源策略）
2、通过jsonp跨域
3、 document.domain + iframe跨域
4、 location.hash + iframe
5、 window.name + iframe跨域
6、 postMessage跨域
7、 跨域资源共享（CORS）
8、 nginx代理跨域
9、 nodejs中间件代理跨域
x、 WebSocket协议跨域
参考
