华泰Web前端研发效能提升之路

1. 华泰 Web 前端研发效能提升之路 —— 一个前互联网人对金融 IT 研发效能的认知重塑之路主讲人：田由时间： 2022/6/25

2. 目录 01 面临的挑战 02 探索与改变 03 新问题与新尝试 04 立足当下，放眼未来困境破局进取展望

3. 01 面临的挑战困境：金融行业的 IT 研发效能的挑战？

4. 关于我们 1000+ Web 项目挑战 1: 系统多

5. 领域特点产品产品A 产品B … 产品C … … 外购系统研发中心人员结构 A B 财富 C A B 机构 A B 投行 C 外购 B A 自营 A A 资管 A … 挑战 2: 集成需求复杂 … 自有员工外包员工挑战 3: 开发人员结构复杂

6. 02 探索与改变破局：做了哪些针对性的探索与改变？

7. 横向资源池成立前端横向团队，整合前端资源，动态支持各业务项目，实现资源灵活调配，提升交付效率通用工具整合框架探索与实践业务价值交付平台能力业务交付基础设施建设技术架构持续优化领域方案沉淀共享与开放 -> 深度融合

8. 标准化建设研发现状调研，如统计 gitlab 应用技术类型应用类型 UI 框架构建工具微前端 ……

9. 标准化建设应用模版建设：覆盖主要技术栈的标准工程模版通用能力集成：埋点、监控、mock、国际化等 CI/CD 流程绑定：与应用模版进行针对性融合工程规范约束：提交规范、分支规范、代码规范、流程规范、文档规范等

10. 标准化建设 —— 通用组件库 Sprite UI：中后台通用组件库部分接入案例：

11. 标准化建设 —— 物料市场 + 业务组件库物料市场：领域级组建物料开发的基础设施部分接入案 • 工程模版 • 开发构建工具 • CI/CD流水线 • 文档展示 • 工程规范例：

12. 标准化建设 —— 领域能力（vs-editor）插件化：插件化接入，支持自定义插件扩展能力领域特色：领域插件，如研报、路演、专题、活动等领域类型节点 WYSIWYG ：内容 → 排版预览，生产方与消费方的一致体验

13. 标准化建设 —— 领域能力表单引擎 eva-form

14. 标准化建设 —— 微前端（bigbox）标准：制定应用集成协议、开发构建插件灵活：模块级应用，不用在基座应用里注册子模块运行时：引入运行时跨技术栈适配层

15. 监控体系异常监控 + 性能监控

16. 标准化建设

17. 小结 • 从研发资源、标准、通用能力探索提效边界：整合+ 规范+ 复用+ 流程保障 • 务实：聚焦业务，一切要以解决工作中实际痛点为出发点

18. 03 新问题与新尝试挑战：如何应对更高的效能要求？

19. 搭建平台运营活动类需求特点：传统开发流程特点： • 需求频次高 • 链路⻓，效率低 • 生命周期短 • 试错成本高 • 开发节奏快需求设计交互设计可行性分析视觉设计需求分析系统设计产品开发周期数据分析安全设计合规⻛控审核编码实现推广运营联调发布上线测试

20. 搭建平台业务场景： • 营销活动⻚面 • 中后台典型⻚面 • 铃客轻应用平台特点： • 可视化开发，灵活的编排能力 • 工程化能力：搭建、预览、发布、上线 • 物料扩展：打造丰富的物料生态 • 源码输出 : 快速集成到应用系统中

21. 一站式研发平台 —— 从研发工具链到研发平台研发辅助工具分散：应用创建、组件开发、应用开发、集成部署、监控，分散在不同地方 • 项目管理类：项目协作 Jira 、需求管理 Confluence • 研发构建类：代码编辑器 VS Code、版本控制工具 Git、构建工具 Maven 、CI/CD 工具 Jenkins • 代码测试类：流水线集成自动化测试 • 部署运行类：Docker，Kubernetes • 监控运维类：xlog • 沟通协作类：铃客数据分散：信息流被阻断，研发数据无法共享人工操作：费时且不可靠

22. 一站式研发平台引入字节 Web Infra 团队优秀实践，建设覆盖工程方案管理、可视化配置、在线开发、单元测试、集成部署与运维监控的一站式平台

23. 一站式研发平台 All-in-one 显著地提升研发效率

24. 在线开发 —— WebIDE 团队协作需求 • 总部+北上深四地协同开发 • 外包开发（代码级）技术指导 • 更好的 code review 体验等环境配置问题： • 初始化配置 • IDE 或配置引起的格式化问题浏览器即开发环境，抹平环境差异，聚焦于业务开发

25. 小结新尝试 • 搭建平台 • 支持在线开发的一站式研发平台降本增效：标准化、自动化、一体化，开发精力聚焦到业务本身上

26. 04 立足当下，放眼未来展望：我们还做了哪些？

27. 展望 • Deploy → Serverless • 贯通的研发平台+搭建平台+部署平台

28. 总结 • 持续探索与实践 • 研效工具只是起点，需要研发规模与流程配合 • 从实践到共建

29. Q&A

30. Thanks ！