Appearance
应用拓扑编排 (ATC 阿里合作项目)
什么是 ATC
应用拓扑编排(Application Topology Choreographer,简称 ATC)是阿里云推出的一款面向云原生应用的架构可视化设计工具。ATC 基于组件化思维,以拖、拉、拽的方式实现应用架构的设计和编排,不仅可以简单快速地完成复杂业务系统架构的设计,并一键发布到EDAS,还可以从业务维度实现应用的批量快速发布及站点级别应用快速复制。
可视化编排
ATC 采用拖、拉、拽和搭积木的方式,一键拉起整套业务系统,大大提高应用设计及发布效率。
业务架构可组装
云上微服务应用架构框架可抽象为网关组件、资源形态、注册中心以及可观测能力。ATC 将该四部分框架组装处理,可随意搭配,让您聚焦自身业务形态。
EDAS 升级公告(2022年11月25日)| 企业级分布式应用服务
新增功能 应用拓扑编排 ATC:应用拓扑编排 ATC 是一款面向云原生应用的架构可视化设计工具。ATC 基于组件化思维,以拖、拉、拽的方式实现应用架构的设计和编排,不仅可以简单快速地完成复杂业务系统架构的设计,并一键发布到EDAS,还可以从业务维度实现应用的批量快速发布及站点级别应用快速复制。
技术选型
ATC 项目采用了现代化的前端技术栈:
- React + TypeScript
- valtio(状态管理)
- react-flow(流程图组件)
- tailwind(CSS 框架)
- storybook(组件开发工具)
负责内容
在 ATC 项目中,主要负责以下工作:
- 架构设计、技术选型、需求评审、实现方案讨论、前端规范制定
- Domain 的 schema 设计,对应基础 TS 类型设计,项目目录结构划分
- 开发功能代码,hooks 封装等
- 领导其他3个前端开发人员,进行任务分配和 code review
- 任务拆分、工期评估,问题矛盾汇总,并与产品、UI、后台人员沟通或测试联调
- 对团队中其他成员遇到的疑难功能进行调研并提供解决方案
项目难点与解决方案
DDD Schema 结构设计:设计满足可视化拖拉拽流程图需求的 DDD Schema 结构,实现声明后复用逻辑业务需求
定制化流程图组件开发:根据业务需求定制化开发流程图的拖拉拽组件,包括自定义流程图节点、自定义连线、元素相应的表单等
性能优化:针对流程图元素多时的性能问题进行优化,将某些操作的卡顿从多步降低到1秒以下
撤销/重做功能:实现流程图编辑过程的撤销与重做功能
手动分组功能:实现分组父级节点大小调整、节点布局自动排布等功能
列表优化:在日志查看等列表功能中使用虚拟列表技术提升性能