前端工程化-在React中对DDD领域驱动架构设计的实践

Posted 2022-11-30 Songlcy

如何构建更稳健的前端业务模块代码组织形式？

这是一个可以引来众多争议的话题，也是每个项目工程开发之前必须考虑的问题。

方案

1. 控制反转 + 依赖注入 + 面向服务 (IOC + DI + SOA) 

2. 状态提升 + 模块提升 = LIFT原则

3. 注入令牌 + 服务函数 + 注入点 = 灵活SOA

4. Base、Full、Stream Hooks

5. Functional Component

规则

1. useContext 多管道复用，跨组件数据传递，跨模块功能调用，利用SOA进行反转

2. 单一职责，数据接口隔离

3. 最小权限化，隐藏实现细节

4. 禁止深复制

5. 组件苗条、精简、聚焦

6. 数据全部序列化

7. 服务中只存在基础hooks，自定义hooks，第三方hooks，静态数据，工具函数

8. 通过组件的props进行分流（map + key）

9. 组件除注入，无任何逻辑

10. 单例服务（避免创建多次，全局共享）,需要注入单一节点（createContext）使用服务的子组件使用useContext即可使用服务，360度无死角拥抱

11. 不涉及reRender处理，则特定声明或 memo 处理

12. 禁止在顶层注入&#x