The Plan for React 18

The React team is pleased to announce that React 18 is now in Beta. This major version will provide out-of-the-box improvements, such as automatic batching, new APIs, and a streaming server renderer with React.lazy support. The opt-in mechanism for enabling these features is called ‘concurrent rendering’ and it prepares multiple versions of the UI simultaneously.

React 18 will come with a gradual adoption strategy, meaning that no significant out-of-the-box breaking changes will occur. This will make it easier for users to upgrade with minimal or no changes to the application code. The React team has successfully shipped concurrent features to tens of thousands of components at Facebook, and in their experience, most components “just work” without additional changes.

To facilitate a smooth upgrade for the entire community, the React team has created a React 18 Working Group which includes developers, library authors, and educators from across the React community. This Working Group is open for public reading on GitHub Discussions.

The React team has also published a React 18 Alpha which can be found on npm using the @alpha tag. This release is built using the most recent commit to the main repo and users should be aware that significant behavioral or API changes may occur between Alpha releases.

No specific release date is scheduled yet, but the React team expects it will take several months of feedback and iteration before React 18 is ready for most production applications. More details about the projected release timeline are available in the Working Group.

Related Post

Popular Node.js practices to reconsiderPopular Node.js practices to reconsider

<table border=0 cellpadding=0 cellspacing=0 align="center" border="0"> <tr><td style="font-family: -apple-system,BlinkMacSystemFont,Helvetica,sans-serif; font-size: 15px; line-height: 1.55em; "> <div> <table border=0 cellpadding=0 cellspacing=0 border=0 cellpadding=0 cellspacing=0><tr> <td align="left" style="padding-left: 4px; font-family: -apple-system,BlinkMacSystemFont,Helvetica,sans-serif; font-size: 15px; line-height:

Java-Script JarreJava-Script Jarre

<table border=0 cellpadding=0 cellspacing=0 align="center" border="0"> <tr><td style="font-family: -apple-system,BlinkMacSystemFont,Helvetica,sans-serif; font-size: 15px; line-height: 1.48em; "> <div> <table border=0 cellpadding=0 cellspacing=0 border=0 cellpadding=0 cellspacing=0><tr> <td align="left" style="padding-left: 4px; font-family: -apple-system,BlinkMacSystemFont,Helvetica,sans-serif; font-size: 15px; line-height:

🪜 Decorating with Dr. Axel🪜 Decorating with Dr. Axel

<table border=0 cellpadding=0 cellspacing=0 align="center" border="0"> <tr><td style="font-family: -apple-system,BlinkMacSystemFont,Helvetica,sans-serif; font-size: 15px; line-height: 1.48em; "> <div> <table border=0 cellpadding=0 cellspacing=0 border=0 cellpadding=0 cellspacing=0><tr> <td align="left" style="padding-left: 4px; font-family: -apple-system,BlinkMacSystemFont,Helvetica,sans-serif; font-size: 15px; line-height: