Hello, everyone. I am Karsong.

React18 was released on March 29, 2022.

Since V16, the React team has popularized the concept of concurrency. During the iterations of V18 (alpha, Beta, RC), concurrency has also been popularized, so there will be nothing new when the official release is made.

This article focuses on some of the future trends revealed in the V18 release logs.

Welcome to join the Human high quality front-end framework research group, Band fly

Developers may not be exposed to concurrency features

React is very cautious about adding apis. Since 2013, updates have been triggered by this.setState.

With the introduction of concurrency, there are several concurrent apis, such as:

  • useTransition

  • useDeferredValue

There are even concurrent bottom-feeding apis (i.e., not using these apis can be buggy in concurrent situations), such as:

  • useSyncExternalStore

  • useInsertionEffect

With so many apis, it’s not just useState that doesn’t have to be used, and concurrency is a feature unfamiliar to most front-end developers.

Think about how hard it is to get developers to use concurrency features.

As a result, in future applications developed with V18, developers may not be exposed to concurrency features. These features are more likely to be packaged by various libraries.

For example, startTransition lets users switch between views without blocking user input.

This API will most likely be implemented by various Routers and open to developers as a configuration item.

Things can be Suspense

For React, there are two types of bottlenecks that need to be addressed:

  • CPU bottlenecks, such as page stalling due to heavy computing operations

  • IO bottlenecks, such as waiting time for server data requests

The CPU bottleneck is solved by priority interrupt mechanism of concurrency feature.

Suspense solves IO bottlenecks.

In the future, all IO related operations will converge to Suspense solution.

Suspense is finally available for everything from the initial React.lazy to Server Components, which are still in development today.

Some of the logic is complicated, like this:

  • Server Components

  • New server-side rendering scheme

Therefore, these operations are unlikely to be directed to developers.

Again, these operations are handed over to various libraries. If the complexity is higher, it will be implemented by a Framework based on React encapsulation, such as next.js and Remix.

That’s why Sebastian, a key member of the React team, joined next.js.

React will be positioned as a front-end, low-level operating system that is complex enough to be used with caution.

Developers use the operating system based on the implementation of a variety of upper applications.

conclusion

If v16’s React Like libraries were still able to take part of React cake by virtue of their size and performance advantages, the two libraries will go on two different tracks in the future, because they are no longer compatible with each other.

There will no longer be a React bucket, and the components in the bucket will eventually become just small modules within a larger framework.

Do you currently use React directly in your business, or do you use various frameworks (such as next.js)?