React 16/17/18/19 超精简速记版(面试前5分钟背完)
一、版本核心定位(必背)
- React 16 :Hooks 元年,函数组件崛起,开启现代React
- React 17 :过渡版,无新功能,只为平滑升级、兼容多版本
- React 18 :并发革命,自动批处理+并发渲染,性能大提升
- React 19 :开发革命,异步组件+原生表单+RSC正式落地,代码极简
二、核心差异速查表(一眼记住)
| 核心功能 | React 16 | React 17 | React 18 | React 19 |
|---|---|---|---|---|
| Hooks | 首次推出 | 支持 | 支持 | 支持 |
| 并发渲染 | ❌ | ❌ | ✅ | ✅ |
| 自动批处理 | ❌(仅React事件合并) | ❌ | ✅(全场景合并) | ✅ |
| 异步组件 | React.lazy(仅懒加载) | 同16 | 支持Suspense数据获取 | 组件直接async/await |
| 表单开发 | 手动onChange/value | 同16 | 同16 | 原生form action+useFormState |
| 服务端组件 | ❌ | ❌ | 实验版 | ✅ 正式(RSC) |
| 关键新Hooks | useState/useEffect | 无 | useTransition/useId | useActionState/useOptimistic |
三、高频考点浓缩(面试必答)
- 批处理区别:16/17仅React事件合并,18+全场景(定时器/异步)合并,只渲染1次
- 渲染架构:16/17同步阻塞,18+并发渲染,页面不卡顿
- 17独有:事件系统绑定根节点,支持渐进式升级
- 19核心:表单不用受控组件、组件支持async、RSC正式可用
四、一句话总结(终极记忆)
16靠Hooks,17是过渡,18拼并发,19做简化