DEV Community

Cover image for React 18 is coming! Know about new Features
Aniruddh Agarwal for Extern Labs Inc.

Posted on • Updated on

React 18 is coming! Know about new Features

React 17 was announced last year; It was primarily designed to improve basic groundwork and architecture for upcoming updates and didn’t offer new features. It was intentionally built for upcoming update adoption to make things easier and faster for the future.

Now Facebook and React community is preparing to get us into React 18. On their web blog in June, they have announced that they are working on React 18, and we can expect it next year. As of Now, React 18 is in the alpha stage, and beta builds are just 3 to 5 months away. They mentioned a timeline of their work that we will discuss later, and a dedicated team working on improving alpha React 18, and the community provides them log and bugs.

React 18 is coming

We are currently using React 17.0.2, and React 18 is just a few months away; until then, developers provided alpha builds of React 18 for testing and feedback. With React 18 alpha, we can react to 18’s upcoming features that we will talk about later in this article.

Every ReactJS user was waiting for something big in the form of an update, and then they just announced ReactJS 18. From React 17, ReactJS Developers kept us in wait and suspense, but now we all know that we will get what we have been waiting for. Still, there might be more stable builds of ReactJS 18, but we will talk about everything that we know so far.

Features Coming with React 18

Even Alpha Builds includes many changes and new features; then, stable builds will be unique. Here are the features that we have in the latest alpha build of React 18 -

  • Automatic Batching
  • Concurrent Rendering
  • Root API
  • Strict Effect Mode

Automatic Batching

Groups of React multiple-state turning into one render for better performance is called Batching.

Before, we had to batch two or more state updates inside the same event into one rerender batch. This will prevent the half-finished rendering of components. With React 18, All this batching process got changed and updated. In addition, react 18 Automated this whole process making this batching process more consistent and streamlined.

It can always rerender automatic batching no matter where the states are.

Concurrent Rendering

Another significant change seen in React 18 is ‘Concurrent Mode’ instead of ‘concurrent rendering’ of previous react versions.

It is not just a name change; this will allow adopting concurrent features without rewriting codes and according to developers. There will be many features in React 18 that might come optin; As alpha, not all of them are mentioned anywhere yet. Here are some concurrent mode features that we know for now

This made the new Concurrent Mode more fast, productive, effortless, and efficient.

Root API

Root API is a pointer for data structure in previous versions of React. They are primarily used to track render trees. With the new React 18, It will deploy two different root APIs, Legacy root API, and the new ReactDOM.createRoot. the legacy root will run legacy mode in ReactDOM.createRoot API. This ReactDOM.createRoot can integrate improvements to the app efficiently and add a deprecated warning.

Old root API

React 18 will be a vast improvement, and we are all going to leverage its advanced features. Developers are halfway through the development yet, still impressed users with these fantastic features. You can try Alpha ReactJS 18 from their website or wait for 3 to 5 months for a richer stable build.

Top comments (0)