系统架构
定义分层架构和模块划分
分层架构
┌──────────────────────────────────────────────────────────────┐
│ UI Layer │
│ 导航系统 + 组件 + 页面 │
├──────────────────────────────────────────────────────────────┤
│ State Layer │
│ 客户端状态 + 服务端状态缓存 │
├──────────────────────────────────────────────────────────────┤
│ Service Layer │
│ 链适配器 + 平台服务 + 工具函数 │
├──────────────────────────────────────────────────────────────┤
│ Platform Layer │
│ Web APIs / DWEB 平台插件 │
└──────────────────────────────────────────────────────────────┘各层职责规范
UI Layer
- MUST 只负责界面渲染和用户交互
- MUST NOT 包含业务逻辑
- SHOULD 使用声明式组件模式
- SHOULD 支持组件热替换
State Layer
- MUST 区分客户端状态和服务端状态
- MUST 提供响应式状态订阅
- SHOULD 支持状态持久化
- SHOULD 支持细粒度状态订阅（避免过度渲染）
Service Layer
- MUST 通过接口抽象隐藏实现细节
- MUST 支持依赖注入模式
- MUST NOT 依赖 UI 层
- SHOULD 提供适配器模式支持多链
Platform Layer
- MUST 统一抽象平台差异
- MUST 提供能力检测机制
- SHOULD 提供降级策略
目录结构规范
src/
├── navigation/ # 导航系统
│ ├── screens/ # 屏幕/页面定义
│ ├── components/ # 导航组件
│ ├── hooks/ # 导航 Hooks
│ └── config # 导航配置
│
├── pages/ # 页面组件
│ ├── home/ # 首页
│ ├── wallet/ # 钱包相关
│ ├── send/ # 发送
│ ├── receive/ # 收款
│ ├── settings/ # 设置
│ └── authorize/ # DWEB 授权
│
├── components/ # 通用组件
│ ├── ui/ # 基础 UI 组件
│ ├── common/ # 业务通用组件
│ ├── wallet/ # 钱包相关组件
│ └── layout/ # 布局组件
│
├── stores/ # 状态管理
│ ├── wallet # 钱包状态
│ ├── preferences # 用户偏好
│ └── ui # UI 状态
│
├── services/ # 服务层
│ ├── adapters/ # 链适配器
│ ├── platform/ # 平台服务
│ └── utils/ # 工具函数
│
├── hooks/ # 通用 Hooks
├── i18n/ # 国际化
├── lib/ # 库封装
│ ├── crypto/ # 加密相关
│ └── utils/ # 工具函数
│
└── styles/ # 全局样式模块依赖规则
依赖方向
Pages/Screens
│
▼
┌─────────┴─────────┐
│ │
▼ ▼
Components Stores
│ │
└─────────┬─────────┘
│
▼
Services
│
▼
Platform规范
- 单向依赖 - 上层可依赖下层，下层 MUST NOT 依赖上层
- 同层隔离 - 同层模块 SHOULD NOT 相互依赖
- 接口依赖 - MUST 依赖抽象接口而非具体实现
- 显式依赖 - MUST 通过显式导入声明依赖关系
数据流规范
读取流程
用户操作
│
▼
┌─────────────┐
│ Component │ ─── 查询状态 ───► 缓存命中？
└─────────────┘ │
┌───────┴───────┐
│ │
Yes No
│ │
▼ ▼
返回缓存 调用 Service
│
▼
Chain Adapter
│
▼
区块链节点写入流程
用户提交
│
▼
┌─────────────┐
│ Component │ ─── 执行变更 ───► Service
└─────────────┘ │
▼
Chain Adapter
│
▼
签名交易
│
▼
广播交易
│
▼
更新缓存
│
▼
UI 更新错误处理规范
错误分类
| 类型 | 处理位置 | 用户反馈 |
|---|---|---|
| 网络错误 | Service 层 | Toast + 重试按钮 |
| 验证错误 | 表单层 | 字段级错误提示 |
| 业务错误 | 页面层 | 错误弹窗 |
| 系统错误 | 全局层 | 错误边界页面 |
规范
- MUST 在最接近错误源的层级处理错误
- MUST 提供用户可理解的错误消息
- MUST 支持错误重试机制
- SHOULD 实现全局错误边界
- SHOULD 记录错误日志用于调试
性能优化规范
代码分割
- MUST 按路由进行代码分割
- SHOULD 延迟加载非首屏页面
- MAY 预加载高概率访问的页面
状态优化
- MUST 使用细粒度状态订阅
- MUST 避免不必要的状态更新
- SHOULD 使用组件记忆化
查询优化
- SHOULD 实现数据预取
- SHOULD 支持并行查询
- SHOULD 合理配置缓存策略
渲染优化
- MUST 避免大列表一次性渲染
- SHOULD 使用虚拟滚动
- SHOULD 优化图片加载
本章小结
- 四层架构：UI → State → Service → Platform
- 单向依赖，层级分明
- 数据流清晰，读写分离
- 错误处理分类明确
- 性能优化策略完备