The React blog released the latest update on v18 at 1am today.

Three pieces of official news

In the React18 work Plan blog post, there are three official pieces of news.

  1. Work on V18 is already underway and will be the next major release

  2. Created v18 working group, let community experts, developers, library authors try V18 first, for the community of many libraries pre-compatible CM(Concurrent Mode), education community preparation

Working Group address

  1. releasedv18 AlphaVersion so library authors can try it out and provide feedback

Using v18 Alpha

Here’s the message behind the message.

What are the stepping stones on

As we know, V17 is a stepping stone version to stabilize CM.

The reason why CM is difficult to stabilize can be summarized in a word:

CM brought app level Breaking Change to React, and it was unprecedented

The workload here consists of two parts:

  • The development cost of supporting the new features of V18

  • Development and communication costs to help the community gradually upgrade to V18

The development cost of a new feature

The main features of V18 are streaming SSR predominance relying on Suspense with different priorities.

Suspense with different priorities relies on the more flexible CM.

Flexibility here means that priorities can be compared not only individually but also in the concept of batches.

Therefore, Andrew needs to complete the development of Lanes priority scheduling algorithm in V16.13.1.

At the same time, the support for more flexible CM at the bottom level also brings to the top such as:

  • startTransition,useDeferredValuesuchAPICan be explicitly specified by the developerUIPriority of rendering.

For example, you can use useDeferredValue to automatically debounce based on the user’s device performance (QPS).

  • New apis such as OffScreen (keep-Alive for React)

  • Automatic batchUpdate is not limited to event callback functions

The cost of incremental upgrades to the community

The official update also revealed that upgrading to V18 will change little or no existing code.

The reason: CM is optional (that is, time slicing is turned off by default).

As mentioned earlier, CM relies on priority scheduling, and priority scheduling is implemented on the time-slicing architecture.

So, when time slicing is turned off by default, existing code can be smoothly upgraded to V18 with few changes.

As you can see, the time slice feature is labeled Umbrella, indicating that it affects many apis, architectures, and libraries

React refactored the event mechanism internally with v17.

React events do not bubble to the uniform root node, but to the root node of each application (that is, the node that calls reactdom.render).

This allows one part of the entire application to maintain the existing Legacy mode and the new part to enable CM, since the two sub-applications are independent of each other.

React also developed a new API, create-Subscription, to subscribe to external dependencies, since Breaking Change brought by CM made a large library incompatible (e.g. Mobx).

This is why V18 Alpha is preferred to library authors – existing implementations of the library may not be compatible when full CM functionality is enabled.

Point in time

Currently v18 Alpha is available. The public beta will be released in a few months.

There will be an RC release a few weeks after the beta release.

Finally, a stable version will be released at least a few weeks after the RC release.

So the overall expectation is that the V18 stable will be here by the end of the year.

At that time, the React team will focus on Server Components.

How to upgrade React? How to upgrade React source code