Composition API 与 React Hook 很像,区别是什么?

从 React Hook 的实现角度看,React Hook 是根据 useState 调用的顺序来确定下一次重渲染时的 state 是来源于哪个 useState,所以出现了以下限制:

  • 不能在循环、条件、嵌套函数中调用 Hook;
  • 必须确保总是在你的 React 函数的顶层调用 Hook;
  • useEffect、useMemo 等函数必须手动确定依赖关系。

而 Composition API 是基于 Vue 的响应式系统实现的,与 React Hook 的相比:

  • 声明在 setup 函数内,一次组件实例化只调用一次 setup,而 React Hook 每次重渲染都需要调用 Hook,使得React 的 GC 比 Vue 更有压力,性能也相对于 Vue 来说也较慢;
  • Compositon API 的调用不需要顾虑调用顺序,也可以在循环、条件、嵌套函数中使用;
  • 响应式系统自动实现了依赖收集,进而组件的部分的性能优化由 Vue 内部自己完成,而 React Hook 需要手动传入依赖,而且必须保证依赖的顺序,让 useEffect、useMemo 等函数正确的捕获依赖变量,否则会由于依赖不正确使得组件性能下降。

虽然 Compositon API 看起来比 React Hook 好用,但是其设计思想也是借鉴 React Hook 的。

相关推荐
钛态7 小时前
前端微前端架构:大项目的救命稻草还是自找麻烦?
前端·vue·react·web
钛态7 小时前
前端趋势:别被时代抛弃
前端·vue·react·web
恶猫17 小时前
网页自动化模拟操作时,模拟真实按键触发事件【终级方案】
前端·javascript·自动化·vue·网页模拟
无心使然云中漫步21 小时前
Openlayers调用ArcGis地图服务之五 —— 要素识别(/identify)
前端·arcgis·vue·数据可视化
蜡台21 小时前
H5入住浙里办App详细步骤
vue·uniapp·h5·浙政钉
呱牛do it2 天前
企业级门户网站设计与实现:基于SpringBoot + Vue3的全栈解决方案(Day 7)
java·vue
徐子童2 天前
复合索引会失效的场景
数据库·mysql·面试题·索引失效
wuxinyan1234 天前
Java面试题51:一文深入了解K8s 环境下企业级 CI/CD 流水线搭建
java·ci/cd·kubernetes·面试题
wuxinyan1234 天前
Java面试题52:一文深入了解Kubernetes 核心资源对象
java·kubernetes·面试题
呱牛do it4 天前
企业级门户网站设计与实现:基于SpringBoot + Vue3的全栈解决方案(Day 5)
java·vue