这是我参与「第五届青训营」伴学笔记创作活动的第6天
一.React的历史与应用
- 前端应用
- 移动原生应用
- 桌面应用（Electron）
二.React设计思路推演
原生Javascript弊端：
1.状态更新UI不会自动更新，需要手动调用DOM更新
2.欠缺基本代码层面的封装和隔离，代码层面没有组件
3.UI之间的数据依赖关系需要手动维护，链路过长-Callback Hell
Callback Hell：JS异步编程或使用大量回调函数时，代码复杂不直观
概念区分：
- 转换式系统：输入-输出
- 响应式系统：监听-行为
改进：
1。状态更新，UI自动更新
2.前端代码组件化，可复用、封装
3.状态之间相互依赖
组件：有自己的状态，外部不可见（封装？），父组件可以将状态传入内部（单向数据流）
状态放在组件内部
三.Reack的Hook写法
const [count,setCount]=useState(0);
不能在循环、条件或嵌套函数中调用Hook
四.React实现
Virtual DOM：用于和真实DOM同步，而在JS内存中维护的一个对象，具有和DOM类似的树状结构，并和DOM可以建立一一对应的关系。
最小Diff 复杂度O（n^3）
Heuiristic O(n) Algorithm
局部最优（每一步的局部最优并不代表整体最优解）
提升Diff：
- 不同类型的元素：替换
- 同类型的DOM元素：更新
- 同类型的组件元素：递归
五.状态管理库
状态放在组件外部---状态复用性降低
状态管理库：redux，xstate，mobx，recoil（将状态抽离到UI外部进行统一管理）
状态机 ：当前状态，收到外部事件，迁移到下一个状态（例子：红绿灯）
六.应用级框架
1.NEXT.js 刷新速度快，Serviceless一键部署
2.MODERN.js 内置许多开箱即用的能力
3.Blitz 无API的全栈开发框架，开发过程中无需写API调用与CRUD逻辑，适合前后端紧密的小团队
