前言
第1章 邂逅React/
1.1React的优势分析/
1.2React 发展历程/
第2章 了解JSX/
2.1认识JSX/
2.1.1JSX是什么/
2.1.2React.createElement/
2.1.3JSX 转换逻辑/
2.1.4ReactElement对象/
2.2操作JSX/
2.2.1JSX与Element对象/
2.2.2Element方法集/
2.2.3Element对象持久化/
2.3JSX转换Element对象流程/
2.3.1createElement原理揭秘/
2.3.2cloneElement原理揭秘/
2.4实践:可控性渲染/
2.5Babel解析JSX/
2.5.1Babel插件/
2.5.2API层面模拟实现/
第3章 React组件/
3.1组件是什么/
3.1.1组件的定义/
3.1.2组件的特性/
3.2两种类型的组件/
3.2.1类组件/
3.2.2函数组件/
3.3组件的通信方式/
3.3.1props和callback方式/
3.3.2eventBus事件总线/
3.3.3其他方式/
3.4组件的设计模式/
3.5组件的继承/
3.5.1继承模式的介绍/
3.5.2继承模式实践:编写权限路由/
3.6高阶组件(HOC)/
3.6.1什么是高阶组件/
3.6.2高阶组件解决了什么问题/
3.6.3高阶组件之属性代理/
3.6.4高阶组件之反向继承/
3.6.5高阶组件功能/
3.6.6高阶组件注意事项/
3.6.7高阶组件实践:渲染分片/
3.6.8高阶组件功能总结/
第4章 React更新驱动/
4.1React 驱动源/
4.1.1谁在驱动React更新/
4.1.2React更新流/
4.2React props/
4.2.1props的概念及作用/
4.2.2props 的使用技巧/
4.3组合模式和 render props 模式/
4.3.1组合模式/
4.3.2实践:组合模式实现tab和tabItem/
4.3.3render props模式/
4.4State驱动/
4.4.1类组件setState介绍/
4.4.2函数组件中的useState/
4.5主流框架批量更新模式/
4.5.1宏任务和微任务/
4.5.2微任务|宏任务实现批量更新/
4.5.3可控任务实现批量更新/
4.6两种模式下的State更新/
4.6.1legacy模式和concurrent模式/
4.6.2老版本legacy模式下的更新/
4.6.3新版本concurrent模式下的更新/
4.6.4flushSync提高优先级/
4.7外部数据源/
4.7.1什么是外部数据源/
4.7.2useSyncExternalStore介绍/
4.7.3useSyncExternalStore原理及其模拟/
第5章 React生命周期/
5.1生命周期介绍/
5.1.1生命周期意义及两大阶段/
5.1.2React生命周期及其特点/
5.2类组件生命周期/
5.2.1类组件初始化流程及其生命周期/
5.2.2类组件更新流程及其生命周期/
5.2.3类组件销毁流程及其生命周期/
5.2.4commit阶段细节补充/
5.3类组件生命周期的作用/
5.3.1类组件生命周期能做些什么/
5.3.2类组件渲染错误边界/
5.4函数组件生命周期替代方案/
5.4.1useEffect和useLayoutEffect/
5.4.2useInsertionEffect/
5.4.3生命周期替代方案/
5.5实践:实现ScrollView组件/
第6章 React状态获取与传递/
6.1ref 对象介绍/
6.2ref 使用及应用场景/
6.2.1ref 的使用/
6.2.2forwardref 转发ref/
6.2.3ref 其他应用场景/
6.3Context 介绍/
6.3.1什么是Context/
6.3.2Context 解决了什么问题/
6.4新老版本Context/
6.4.1老版本Context/
6.4.2新版本Context/
6.4.3动态Context/
6.5Context 特性/
6.5.1嵌套多个Context/
6.5.2逐层传递Provider/
6.6Context实现切换主题功能/
第7章 工程化配置及跨平台开发/
7.1React 环境搭建/
7.1.1环境搭建/
7.1.2create-react-app创建项目/
7.2CSS模块化/
7.2.1为什么要用CSS模块化/
7.2.2CSS模块化之CSS Modules/
7.2.3CSS模块化之CSS IN JS/
7.2.4CSS模块化总结/
7.3React服务端渲染/
7.3.1React SSR流程分析/
7.3.2React SSR框架Next.js/
7.4React Native跨平台开发/
7.4.1从JS引擎到JSI/
7.4.2React Native简介/
第8章 React架构设计/
8.1虚拟DOM与fiber/
8.1.1虚拟DOM/
8.1.2React fiber/
8.2fiber架构/
8.2.1fiber树的构成/
8.2.2fiber树的创建流程/
8.2.3fiber树的更新流程/
8.3React中的位运算/
8.3.1为什么要用位运算/
8.3.2React位掩码场景——更新优先级/
8.3.3React位掩码场景——更新上下文/
8.3.4React位掩码场景——更新标识/
8.4React数据更新架构设计/
8.4.1React更新前置设计/
8.4.2React更新后置设计/
8.5React事件系统设计/
8.5.1React事件系统介绍/
8.5.2事件系统设计/
8.5.3新老版本事件系统差异/
第9章 高性能React/
9.1React内部更新调优/
9.1.1调和优化手段/
9.1.2diff算法/
9.2React外部渲染控制/
9.2.1React渲染本质/
9.2.2React渲染控制手段/
9.2.3对React渲染的思考/
9.3任务调度/
9.3.1为什么要使用异步调度/
9.3.2Scheduler核心实现/
9.4过渡更新任务/
9.4.1Transition使命/
9.4.2Transition模拟场景/
9.4.3Transition具体实现/
9.4.4Transition实现原理/
9.5异步组件和懒加载/
9.5.1异步组件和Suspense/
9.5.2Suspense实现懒加载/
9.5.3Suspense和React.lazy原理实现/
9.5.4React V18 SuspenseList/
9.5.5hydrate模式下的Suspense新特性/
9.5.6Suspense未来可期/
9.6React海量数据处理/
9.6.1渲染切片/
9.6.2长列表优化方案/
9.7React使用细节处理/
9.7.1React中的防抖和节流/
9.7.2React中的动画/
9.7.3在React中防止内存泄露/
9.7.4在React中合理使用状态/
9.8React性能问题检测/
9.8.1Profiler性能检测工具/
9.8.2StrictMode严格模式/
9.8.3调试工具react-devtools/
第10章 React运行时原理探秘/
10.1React运行时总览/
10.1.1初始化流程/
10.1.2更新流程/
10.1.3更新入口scheduleUpdateOnFiber/
10.1.4更新准备工作:标记ChildLanes /
10.1.5开始更新:两大阶段渲染和commit /
10.2渲染阶段流程探秘/
10.2.1fiber更新循环workLoop/
10.2.2最小的更新单元/
10.2.3从beginWork到组件更新全流程/
10.2.4completeWork阶段细节/
10.3Commit阶段流程探秘/
10.3.1更新标志/
10.3.2beforeMutation阶段/
10.3.3mutation阶段/
10.3.4layout阶段/
10.4State更新揭秘/
10.4.1React批量更新原理/
10.4.2legacy模式更新流程/
10.4.3Concurrent模式更新流程/
10.5Context原理揭秘/
10.5.1Context对象的本质/
10.5.2Provider(提供者)/
10.5.3Context更新流程/
10.5.4Consumer、useContext和contextType/
10.5.5Context流程总结/
10.6ref原理揭秘/
10.6.1ref的处理时机和逻辑/
10.6.2ref的处理特性/
10.7scheduler异步调度原理/
10.7.1进入调度scheduleCallback/
10.7.2Concurrent模式如何中断渲染/
10.8React事件原理/
10.8.1新版本事件系统核心实现/
10.8.2老版本事件系统原理差异/
第11章 玩转React Hooks/
11.1Hooks 概览/
11.1.1数据更新驱动/
11.1.2执行副作用/
11.1.3状态的获取与传递/
11.1.4状态的派生与保存/
11.1.5工具Hooks/
11.2Hooks原理/
11.2.1Hooks与fiber/
11.2.2renderWithHooks执行函数/
11.2.3Hooks初始化流程/
11.2.4Hooks更新流程/
11.3自定义Hooks设计/
11.3.1全面理解自定义Hooks/
11.3.2自定义Hooks设计角度分析/
11.4自定义Hooks实践/
11.4.1实践一:自动上报pv/click的埋点/
11.4.2实践二:带查询分页加载的长列表/
11.4.3实践三:Hooks实现React-Redux/
第12章 React-Router/
12.1Spa核心原理/
12.1.1核心原理/
12.1.2History库核心实现/
12.1.3History原理总结/
12.2新老版本路由设计/
12.2.1React-Router核心组成部分/
12.2.2React-Router使用指南/
12.2.3自定义路由及其实践/
12.2.4新版React-Router V6/
12.3老版本路由原理/
12.4新版本路由原理/
12.4.1React-Router V6核心原理/
12.4.2新老版本对比/
12.5实践:从零到一实现路由系统/
12.5.1设计思想/
12.5.2代码实现/
12.5.3验证效果/
第13章 React-Redux状态管理工具/
13.1Redux /
13.1.1Flux架构概念/
13.1.2Redux介绍/
13.2Redux原理浅析/
13.2.1Redux核心API的实现/
13.2.2中间件原理/
13.3React-Redux介绍及其原理/
13.3.1React-Redux介绍/
13.3.2React-Redux实践/
13.3.3React-Redux原理/
第14章 React实践/
14.1实现表单系统/
14.1.1表单设计思路/
14.1.2表单逻辑状态层/
14.1.3表单UI层/
14.1.4功能验证/
14.2弹窗设计与实践/
14.2.1设计思路/
14.2.2代码实现及功能验证/
14.3Keepalive功能的设计与实践/
14.3.1背景:React新属性offScreen/
14.3.2设计思想/
14.3.3架构设计/
14.3.4具体实现最终呈现的Demo效果/