首页 > PHP资讯 > HTML5培训技术 > WEB前端开发框架React v17.0 RC

WEB前端开发框架React v17.0 RC

HTML5培训技术

WEB前端开发框架React v17.0 RC 

 

渐进式升级:同时使用两个 React 版本

从 React 15 升级到 v16 再到 v17,开发者往往要更新整个 APP 后再统一部署,这种体验对开发者很不友好,周期长甚至带来巨坑。从 React 17 开始,当你升级到 v18 甚至未来的更高版本时,你会有更多的选择:

可以像以前一样将整个 codebase 的 React 一次性全部升级,或者;
APP 的一部分升级到 v18 其它部分仍然用 v17 跑,直到整个 APP 完成更新。


在大项目的维护和升级过程中,这一特性尤其重要!想想一下,如果在一个拥有成百上千个组件的项目中,只想升级其中的几个组件到 v18 使用最新的特性,怎么办?所以,为了适应这一场景 v17 作为一个主要版本,将会有一些 breaking changes。渐进式升级是如何运作的,可以运行这个 Demo 看一下 https://github.com/reactjs/react-gradual-upgrade-demo/

事件代理的改变

在 React 16 和之前版本,多数事件使用 document.addEventListener()。在 v17 中,将使用 rootNode.addEventListener()

在 React 17 中 event propagation 默认是停止的!需要添加第三个参数 { capture: true } 到 document.addEventListener 来修正这一问题。

其它 Breaking Changes

向浏览器靠齐
事件  onScroll  不再冒泡
React 的 onFocus 和 onBlur 在底层使用原生的 focusin 和 focusout
Capture phase 事件使用真正的浏览器 capture phase 监听
不再有 Event Pooling
React 17 中移除了“事件池”优化方案,因为在现代浏览器中性能未能提高多少。

添加 Effect Cleanup Timing
在 React 17 中 useEffect 的清除函数选择更一致的时机执行,且是异步的。比如:如果组件正在卸载,清除的动作将在屏幕更新后执行。

统一返回 undefined 的错误信息
React 17 修正了 forwardRef 和 memo 组件忘记 return 时不报错的问题

原生的 Component Stacks
移除私有的 Exports

本文来源于欣才IT学院原创发布,未经许可,禁止转载。