写点什么

React 18 发布

  • 2022-04-01
  • 本文字数:1178 字

    阅读完需:约 4 分钟

React 18 发布

3 月 29 日,React 团队宣布 React 18 正式发布。该版本的主要更新包括开箱即用的功能改进,如自动批处理、新的 AIP(如 startTransition)和支持 Suspense 的流式服务器端渲染。

 

官方博客指出,此版本许多功能都建立在新的并发渲染器之上,这是一个解锁强大新功能的幕后更改。Concurrent React 是可选的,它仅在用户使用并发功能时启用,但开发团队认为它将会对大众构建应用程序的方式产生重大影响。

 

“我们花了数年时间研究和开发对 React 并发的支持,并且我们特别注意为现有用户提供逐步采用的路径。去年夏天,我们成立了 React 18 工作组,收集社区专家的反馈,确保整个 React 生态系统的顺利升级体验。”

 

React 18 的新功能如下:

 

自动批处理功能

 

React 将多个状态,更新到单一的重新渲染作业中,以获得更好的性能,过去没有自动批处理,开发者只能在 React 事件处理程序中批处理更新,而在默认状态下,Promise、setTimeout、原生事件处理程序,或任何 React 内部事件的更新不会在 React 中批处理,而在 React 18 中,这些更新都将可以自动批处理。

 

Transitions 功能

 

React 18 引入了 Transition 的新概念,用来区分紧急和非紧急更新。紧急更新表现在直接交互像是输入、点击和按下等操作,非紧急的过渡更新,则是将 UI 从视图过渡到另一个视图。官方表示,之所以打字、点击和按下等紧急更新需要立即回应,是因为对用户来说,如果这些行为没有立刻获得回应,用户会觉得应用程序发生问题,但是并非所有过渡都是相同的,因为用户并不会期望在屏幕增至到每个中间值。

 

因此开发者应该将单一用户的输入,区分为紧急更新与非紧急过渡更新,以提供最佳的用户体验,开发者可以在输入事件中,使用 startTransition API,来告知 React 紧急与非紧急过渡更新。

 

新的 Suspense 功能

 

开发者现在可以在 React 18 中结合使用 Suspense 与过渡 API,以获得最佳的效果。Suspense 可以让还没准备好渲染的 UI,显示为加载状态,来解决程序代码分割(Code-splitting)和资料截取的问题。在这次更新中,React 会推延渲染,直到应用程序加载足够的资料,以异步操作避免错误的加载状态出现。

 

新的客户端和服务器渲染 API

 

在这个版本中,开发团队重新设计了他们为在客户端和服务器上呈现而公开的 API。这些更改允许用户在升级到 React 18 中的新 API 时继续使用 React 17 模式下的旧 API。

 

新的严格模式行为 (Strict Mode Behaviors)

 

此功能将为 React 应用程序提供更好的开箱即用性能,但要求组件能够对多次挂载和销毁的效果具有弹性。大多数效果无需任何更改即可工作,但有些效果假定它们只挂载或销毁一次。为了帮助解决这些问题,React 18 为严格模式引入了一个新的仅限开发的检查。

 

每当第一次安装组件时,此新检查将自动卸载并重新安装每个组件,并在第二次安装时恢复先前的状态。

 

原文详情:

 

https://reactjs.org/blog/2022/03/29/react-v18.html

2022-04-01 13:359454

评论

发布
暂无评论
发现更多内容

JetBrains pycharm pro 2024最新永久激活码 pycharm2024下载安装

Rose

GreatSQL 中为什么 Update 不会被锁等待

GreatSQL

mac触控板增强神器 BetterTouchTool for Mac破解及安装教程

Rose

一位架构师的自述:在尚未踏入的世界成为你自己

京东零售技术

架构 代码人生 技术成长

研究揭秘生成式AI惊人耗水量!训练1个模型相当于165人1年总用水量!武汉大学首个人形机器人“天问”|AI日报

可信AI进展

淘宝商品详情API接口:电商营销的坚实基石

代码忍者

API 测试 pinduoduo API

腾讯秋招面试,人麻了。。。

王中阳Go

腾讯 面试 面经 大厂面试 秋招

adobe AU2024系统要求 附Audition 2024中文破解版安装包 Mac/win

Rose

DBeaverEE:专业级数据库管理工具,让数据管理更高效

Rose

扬帆云栖,英特尔携手阿里云共缔数智精彩

E科讯

懒人一键安装:pd虚拟机专用windows系统镜像(m1/intel)

你的猪会飞吗

Mac软件下载站 mac破解软件下载

在爬取京东商品详情信息时,如何处理验证码问题?

tbapi

京东商品详情数据接口 京东API

互动LED地砖屏的独特性

Dylan

科技 LED display LED显示屏 led显示屏厂家

使用 fabric.js 开发移动端 H5 图片编辑器细节

秦少卫

Fabric.js 图片编辑器 开源图片编辑器 开源vue图片编辑器 vue图片编辑器

苹果电脑几款好用的效率翻倍工具,轻松管理剪贴板!

Rose

邮储银行,奔跑在智能化软件开发的春天里

脑极体

AI

快速生成应用:AI大模型与低代码平台如何无缝结合提升效率?

天津汇柏科技有限公司

低代码 AI 人工智能

告别音频瑕疵,迎接完美音质——iZotope RX 11,音频工程师的必备神器

Rose

对HttpServletRequest中的Header进行增删

派大星

HttpServletRequest

AI Native平台,跨越AI应用从创新到生产的鸿沟

阿里云大数据AI技术

人工智能 阿里云 云栖大会

2024开放原子开源生态大会将启,深开鸿与您一起共促生态繁荣

科技热闻

云起无垠荣获第九届“创客中国”网络安全专题赛二等奖

云起无垠

鸿蒙保障应用开发安全的技术措施

芯盾时代

鸿蒙 嵌入式

抖音商品sku数据接口(Dy.item_sku)丨抖音平台API数据接口指南

tbapi

抖音商品详情数据接口 抖音API接口 抖音商品sku接口

支持M1的Photoshop 2021 for mac中文直装版安装包分享

Rose

大模型时代下的新一代广告系统

京东零售技术

人工智能 算法 大模型

Nginx配置最全详解(万字图文总结)

江南一点雨

React 18 发布_大前端_闫园园_InfoQ精选文章