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