| 长沙达内教育 | <# 关于本仓库
本仓库是《React 设计原理》的配套代码仓库。
本书旨在帮助读者深入理解 React 的内部运行机制，特别是其核心架构 Fiber 和并发模式（Concurrent Mode）的实现原理。通过从零开始实现一个简化版的 React（名为 "Simple React"），我们将一步步揭示 React 如何管理组件状态、处理更新、以及实现高效的渲染过程。
项目结构
`packages/`：包含 Simple React 的核心实现
- `simple-react/`：React 核心逻辑的实现
- `simple-react-dom/`：DOM 渲染器的实现
- `shared/`：共享的工具函数和常量
`examples/`：示例应用，展示如何使用 Simple React
`docs/`：相关文档和图表
如何使用
安装依赖
```bash
pnpm install
```
构建项目
```bash
pnpm build
```
运行示例
```bash
进入示例目录
cd examples/basic
启动开发服务器
pnpm dev
```
运行测试
```bash
pnpm test
```
学习路径
建议按照以下顺序阅读代码和运行示例：
1. 基础概念：从 `packages/shared` 开始，了解 React 的基本数据结构和工具函数
2. 核心架构：阅读 `packages/simple-react`，理解 Fiber 架构、调和算法和 Hooks 实现
3. 渲染器：查看 `packages/simple-react-dom`，了解如何将 Fiber 树渲染到 DOM
4. 示例应用：运行 `examples/` 中的示例，观察 Simple React 的实际运行效果
主要特性
完整的 Fiber 架构实现
支持函数组件和类组件
实现基础 Hooks（useState、useEffect）
支持并发模式下的时间切片
完整的调和算法（Diffing Algorithm）
错误边界支持
简单的开发者工具
与官方 React 的区别
Simple React 是 React 的简化版实现，主要区别包括：
1. 功能范围：只实现核心功能，省略了部分高级特性
2. 性能优化：省略了生产环境的大量性能优化
3. 开发者工具：仅*供基础的调试支持
4. 测试覆盖：主要关注核心逻辑的正确性
贡献指南
欢迎*交 Issue 和 Pull Request 来改进这个项目。在*交代码前，请确保：
1. 代码风格与现有代码保持一致
2. 添加必要的测试用例
3. 更新相关文档
许可证
本项目采用 MIT 许可证。详见 [LICENSE](LICENSE) 文件。
学习资源
[React 官方文档](https://reactjs.org/docs/getting-started.html)
[React 源码解析](https://github.com/BetaSu/big-react)
[构建你自己的 React](https://pomb.us/build-your-own-react/)
联系方式
如有问题或建议，请通过以下方式联系：
*交 GitHub Issue
发送邮件至：your-email@example.com
---
希望这个项目能帮助你更好地理解 React 的内部工作原理！Happy coding!