前端架构反思:当MVC失效,是否要采用DDD

MVC架构缺陷

MVC的架构足以解决前端多数架构场景,但MVC只能解决单模块自闭合场景,如果一个MVC模块内部不断膨胀拆出多个相互关联的MVC模块,形成的网状结构,就远远超出了MVC的能力范围了。

在前端可视化领域,渲染层的交互可能会相当复杂。

比如我目前项目中的echarts图表,有图表组控制,自定义图形创建的十字/单/双游标和气泡mark控制,曲线样式控制,其上游数据还有复杂的二次采样和等比二次缩放;交互有图表组的拖拽合并分列;曲线的拖拽组合;游标的拖拽等等,早期的MVC架构渐渐无力,形成一堆理不清的线团,谁也不知道一个简单的缩放操作会影响到哪些地方。

最终我将MVC替换为了DDD架构。

DDD设计

之前的MVC架构主要从echarts视角触发,而DDD则从整个业务流程出发,因此将核心逻辑分为了以下几个领域:

领域之间以少量事件通信,重点关注领域内部事件。

比如曲线域有大量model entity以及各自service,以及多model之间的各种交互事件,而曲线域和数据域的交互仅通过两个事件。

项目关键技术设计

为了实现上面的设计思路,我们在基础设施上进行了大量的补充,其中比较重要的有:

  1. 事件中心的设计
  2. Channel-Distributor模式,让websocket client只进行无脑收发,将ws订阅和分发逻辑完全关在消息域
  3. IOC容器解决多实例不同scope的创建销毁juejin.cn/post/754384...
  4. 引用计数,由于存在千万级以上数据,因此当不再有任何一个chart需要消费原始数据时立即清理数据缓存

技术收获

项目中最核心最复杂的业务逻辑全部集中到DDD架构的Core模块,该模块逻辑能够自闭环+独立运行,对其他前端页面来说,可以不再关注这里面的复杂度,仅调用CoreApplication提供的一些事件和方法即可。

另外我们整理了Core模块的领域图,可以一目了然看清领域间事件和领域内事件,能够清晰定位要改动的模块或要复用/增加的关系。

三个月后的技术架构反思

经过一段时间的维护,再来看这个架构,类比后端真正业务上的DDD架构要解决的业务问题,能够看到一些端倪:整个设计被DDD范式裹挟 ,而真正起作用的仅是事件驱动。

DDD 设施 实际角色 说明
Entity (Chart, Line) ECharts 配置项的薄包装 不是有业务规则和不变量保护的领域实体
Aggregate (ChartGroup) 一组图表的引用集合 没有跨聚合一致性问题需要保护
Repository (TaskDataRepo) IndexedDB 的 Dexie 封装 不是领域模型和持久化的桥接
IoC 容器 new 的替代品 Transient 作用域的 Service 用 new 创建反而更直观
EntityServiceGuard 解决 IoC 不能级联创建 Service 的 workaround 本质是框架局限性的补救措施

DDD解决的问题是业务规则和建模,这些在前端领域并不是核心问题。这整套架构设计,虽然理清了关系,但部分场景延长了调用链路,导致出了问题调试非常困难,往往要对照架构图理清流程。

如果让我回到过去再进行一次决策,可能用CQRS模式更简单些。用轻量级的事件总线+不同的读写模型+Saga协调跨读写边界,全链路关注的负担会明显减少。

相关推荐
xcl09251 小时前
北京24小时自助健身房系统软件开发实战:从架构到部署全流程指南
java·spring boot·架构
萧瑟余晖4 小时前
Dubbo SPI扩展机制详解
架构·dubbo
Shulex4 小时前
面向跨境电商多渠道消息系统的技术架构:亚马逊站内信合规对接与自动化执行链路设计
运维·架构·自动化
吴建旭 智宅焕6 小时前
AI搜索时代的智能家居交付知识架构:官网作为可信一手信息源与全国交付基础设施
人工智能·架构·智能家居
孟健6 小时前
出海开发者资金合规:从港卡结汇到完税申报实操
后端·架构
梦帮科技6 小时前
领域认知知识库图谱注入:从双式记账图网络到高质量问答对自动化合成流水线
运维·网络·数据库·人工智能·矩阵·架构·自动化
海宇服务7 小时前
零信任架构实战:基于海宇车型识别精准构建自动化定损网关
运维·人工智能·架构·自动化
悟天特斯8 小时前
边缘计算赋能楼宇智能化:云边协同的实时闭环与自治架构
人工智能·架构·边缘计算
爱学习的程序媛9 小时前
2. 智能应用开发技术栈清单
ai·架构·系统架构·ai应用·智能体开发·智能应用开发
m0_587383009 小时前
24小时自助健身房软硬件解决方案实战指南:从架构设计到部署实施
java·spring·小程序·架构·需求分析