这是我参与「第五届青训营 」伴学笔记创作活动的第9天。
01.React 的历史与应用
02.React 的设计思路
03. React的写法(hooks)
不要在循环,条件或嵌套函数中调用Hook。
- JSX不符合JS标准语法
- 返回的JSX发生改变时,如何更新DOM
Virtual DOM (虚拟DOM)
Virtual DOM 是一种用于和真实DOM同步,而在JS内存中维护的 一个对象,它具有和DOM类似的树状结构,并和DOM可以建立一一对应的关系。它赋予了 React声明式的API:您告诉React希望让Ul是什么状态,React就确保DOM匹配该状态。这使您可以从属性操作、事件处理和手动DOM更新这些在构建应用程序时必要的操作中解放出来。
- State/Props更新时,要重新触发render函数
更新次数少——TradeOff——计算速度快
04.React 的实现
完美的最小Diff算法,需要O(n^3)的复杂度。 牺牲理论最小Diff,换取时间,得到了O(n)复杂度的算法: Heuristic O(n) Algorithm
- 不同类型的元素——替换
- 同类型的DOM元素——更新
- 同类型的组件元素——递归
05.React 状态管理库
redux、xstate、mobx、recoil等 将状态抽离到UI外部进行统一管理 缺点：会降低组件的复用性
状态机——当前状态,收到外部事件,迁移到下一个状态（红绿灯） 是否使用状态机要看状态被组件拥有还是整体拥有
06.应用级框架科普
**NEXT.js **
硅谷明星创业公司 Vercel 的 React 开发框架，稳定，开发体验好，支持Unbundled Dev，SWC等，其同样有 Serverless 一键部署平台帮助开发者快速完成部署。口号是"Let'sMakeWebFaster"
MODERN.js
字节跳动 Web Infra 团队研发的全栈开发框架内置了很多开箱即用的能力与最佳实践，可以减少很多调研选择工具的时间。
Blitz
无API 思想的全栈开发框架，开发过程中无需写API 调用与 CRUD 逻辑，适合前后端紧密结合的小团队项目。
