5
头图

Hello everyone, I'm Casson.

On March 29, 2022, the official version of React18 was released.

Since v16 , the React team has been popularizing the concept of concurrency. In the iterative process of v18 (alpha, Beta, RC), the concurrency features of have also been popularized, so when the official version is released, there are no new features.

This article mainly explains some future development trends revealed in the release log of v18 .

Welcome to join the human high-quality front-end framework group , with flying

Developers may not be exposed to concurrency features

React is very cautious about adding API . Since its birth in 2013, the way to trigger the update is this.setState .

After the introduction of the concurrency concept, there are several API related to the concurrency alone, such as:

  • useTransition
  • useDeferredValue

There are even API which is concurrent (that is, in the case of concurrency, if these APIs are not used, there may be bugs), such as:

  • useSyncExternalStore
  • useInsertionEffect

There are so many API , not API like useState that can't be used. Moreover, the feature of concurrency is somewhat unfamiliar to most front-end developers.

You can think about how hard it is for developers to get started using the concurrency features of .

Therefore, in the future applications developed with v18 , developers may not be exposed to the concurrency feature . These features are more likely to be encapsulated by various libraries.

For example: startTransition allows the user to switch between different views without blocking user input.

This API is likely to be implemented by various Router , and then open to developers as a configuration item.

Everything is Suspense

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

  • The bottleneck of the CPU, such as the operation of a large amount of calculation causes the page to freeze
  • IO bottlenecks, such as waiting time when requesting server data

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

The IO bottleneck of will be solved by Suspense .

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

From the original React.lazy to the Server Components which is still in development today, everything is finally Suspense .

Some of this logic is very complex, such as:

  • Server Components
  • New server-side rendering solution

Therefore, these operations are unlikely to be directly developer-oriented.

This goes back to the previous one, these operations will be implemented by various libraries. If the complexity is higher, it will be implemented by a framework based on React package, such as Next.js , Remix .

This is why , the core figure of the Sebastian React team, will join Next.js .

It can be said that the future positioning of React is: a front-end underlying operating system, which is complex enough and generally used by developers with caution.

The developers use based on the various upper-layer applications implemented by the operating system.

Summarize

If the various v16 libraries before React Like can still take part of the React cake by virtue of their size and performance, then the two will be completely two tracks in the future, because the ecology of the two is no longer compatible.

In the future, there will no longer be the concept of a React family bucket, and the various components in the bucket will eventually be reduced to a small module in a larger framework.

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


卡颂
3.1k 声望16.7k 粉丝