React 于 2013 年由 Facebook(现 Meta)开源,用「声明式 UI」和「虚拟 DOM」改变了前端开发范式。十年间,React 从 class 组件演进到 Hooks、从客户端渲染演进到 Server Components、从 Virtual DOM 演进到 Compiler 自动记忆化——每一次大版本更新都重新定义了前端工程的最佳实践。如今 React 不仅是 UI 库,更是 Next.js、Remix 等全栈框架的核心引擎,掌握 React 意味着掌握了现代 Web 应用的基石。
React 是当今前端开发的核心基础设施,从组件化、虚拟 DOM 到 Hooks、Server Components,React 的演进持续引领着现代 Web 开发的范式。本专题按"核心概念 → 深度特性 → 工程实践 → 生态选型 → 前沿特性"的完整路径组织全部内容。
一、React 核心概念
建立对 React 设计哲学和核心机制的系统认知:
- React 详解:声明式 UI 与组件化开发的现代前端基石 — JSX、组件、Props/State、虚拟 DOM、Hooks 概览、并发渲染、Server Components 预览
- React Hooks 完全指南 — useState/useEffect/useRef/useMemo/useCallback/useReducer/useLayoutEffect + 自定义 Hooks + 最佳实践
- React Server Components 深度解析 — RSC 机制、Server/Client 边界、流式传输、Next.js 落地、混合架构实践
二、框架生态与选型
React 不是唯一选择,了解全景才能做出正确决策:
- React vs Vue vs Svelte vs Solid(2025) — 四大框架 12 维度对比 + 场景选型决策树 + 2025 年推荐
三、状态管理与数据流
把应用状态管理做到清晰可控:
- React 状态管理完全指南 — Context 陷阱、Zustand 极简 Store、Jotai 原子化状态、Redux Toolkit 企业级方案、TanStack Query 服务端状态、选型决策树与性能对比
四、路由与导航
单页应用的路由骨架:
- React Router 完全指南 — v6 声明式路由、嵌套路由与 Outlet、loader/action 数据获取、权限守卫、懒加载、ScrollRestoration、从 v5 迁移指南
五、构建工具与工程化
React 项目的开发体验和生产性能:
- React 构建工具深度对比 — Vite + SWC 原理、Turbopack 架构、Rspack 迁移、esbuild 打包、代码分割与懒加载策略、Monorepo 配置、Bundle 分析
六、类型安全与 TypeScript
TypeScript 是 React 项目的标配:
- React + TypeScript 深度实战 — 泛型组件、Polymorphic 多态组件、Hook 类型、Context 类型安全、Zod 运行时验证、严格 tsconfig 配置
七、性能优化
把 React 应用做到生产级别:
- React 性能优化深度指南 — React.memo、Profiler、虚拟列表、Bundle 分析、并发渲染优化、避免重渲染策略
八、测试与质量保障
从单元测试到 E2E 的完整测试体系:
- React 测试完全指南 — Vitest 单元测试、RTL 组件测试、MSW Mock API、Playwright E2E、Chromatic 视觉回归、CI/CD 集成、覆盖率策略
九、前沿特性
React 的演进方向:
- React 19 新特性完全指南 — Actions、use() Hook、React Compiler 自动记忆化、Server Components 稳定版、Document Metadata、升级路径
十、关联专题
React 是更大生态系统的一部分:
- Next.js 完全指南专题 — React 全栈框架的完整学习路径
- Vercel 专题 — React 应用的最佳部署平台
- Tailwind CSS — React 的主流样式方案
- TypeScript 专题 — React 类型系统的完整指南
- Node.js 专题 — React 应用的后端接口开发
- PostgreSQL 专题 — React 应用的数据库实践