React 19, the latest version of Meta’s JavaScript library for rendering user interfaces, is now available in beta. The update introduces features such as async functions in transitions and the ability to access ref
as a prop for function components.
The React 19 beta was unveiled April 25. A React 19 beta upgrade guide has been published.
React 19 adds support for using async functions in transitions to handle pending states, forms, errors, and optimistic updates automatically. Functions that use async transitions are called Actions. By building on top of Actions, React 19 introduces useOptimistic
to manage optimistic updates and a new hook, React.useActionState
, to handle common cases for Actions. Actions also are integrated with new <form>
features for react-dom
in React 19.
React 19 includes all of the React Server Components features from the Canary channel, meaning libraries that ship with Server Components now can target React 19 as a peer dependency with react-server
export condition for use in frameworks that support the Full-stack React Architecture.
Other improvements in React 19:
- A new API to read resources in render, called
use
, is introduced. - Error reporting has been improved for hydration errors in
react-dom
. - Better support is offered by async scripts; they can be rendered anywhere in a component tree.
- APIs are offered for loading and preloading browser resources for building experiences not held by inefficient resource loading.
- Hydration has been improved to account for third-party scripts and browser extensions.
- Error handling has been improved to remove duplication and provide options for handling caught and uncaught errors.
- Support is being added for rendering document metadata tags in components natively.
<Context>
can be rendered as a provider instead of<Context.Provider>
.- Cleanup functions can be returned from
ref
callbacks. - An
initialValue
option has been added touseDeferredValue
.
Copyright © 2024 IDG Communications, Inc.