Inside React Labs: REACT 19 is coming!
Mitchell Mutandah

Mitchell Mutandah @iammtander

About: Full stack Developer

Location:
Cape Town, SA
Joined:
Dec 2, 2021

Inside React Labs: REACT 19 is coming!

Publish Date: Feb 21 '24
32 18

Hello and welcome! In today's episode, I'm going to share some insights on the upcoming changes in React 19, so without further ado, let's get started with some of the highlights.


The bigger picture

A statement from the React Blog:
In React Labs posts, we write about projects in active research and development. We’ve made significant progress since our last update, and we’d like to share our progress.

React 19 brings major changes and insights for the future.
The blog post provided detailed information on the upcoming release and the direction of React.

React compiler

One key topic discussed was the development of the React compiler, previously a research project. React compiler aims to prevent unnecessary renders in components. Instagram currently uses the React compiler to power its entirety.
The React team is working on implementing the React compiler in future releases to optimize rendering.
React compiler aims to render only the right parts of components. It automatically detects code that doesn't strictly follow React or JavaScript rules
It compiles safe code and skips unsafe code, aiming to improve performance and prevent unnecessary renders

Actions

React 19 extends server actions to include client-only applications. It enables defining synchronous and asynchronous functions for form submission with React managing the lifecycle. Two new hooks, 'useFormStatus' and another, will be introduced as part of the core React Library.
useFormState allows updating state based on form action.
It responds to the useFormStatus hook. Another hook called useOptimistic allows optimistically updating the UI.

React Canaries

React is now allowing us to test new changes before stable release. Changes are available in the Canary Channel for testing. Canary Channel allows users to test changes before the stable release.React 19 is introducing Canary with new features and a major release update.

Canary release includes React server components, asset loading, document metadata, and actions feature
Integration of directives likeuse client and use serverfor fullstack React Frameworks, supporting rendering document metadata and enhancing resource loading using suspense

then

Release date?

I guess you all are wondering about the release date for all these features right? React 19 is expected to be released either this year or the beginning of next year. The expectation for the release timing is based on the mentioned details.

I'm excited about the release and have some plans to provide updates and create new content for React 19. Please go ahead and see the official React Blog post.

That's it! LMK what you think about the upcoming changes.

Until next......

cheers

Comments 18 total

  • András Tóth
    András TóthFeb 22, 2024

    I'm really waiting on useEffectEvent which would solve some ugly hacks.

    • Mitchell Mutandah
      Mitchell MutandahFeb 22, 2024

      I hope it progresses from the 'experimental' phase soon.

      • András Tóth
        András TóthFeb 22, 2024

        The fact that it did not while the tutorial on react.dev absolutely points towards this and also the fact of no release since 2022 made me start looking for React alternatives. There is a scent of a decline in the air.

        • Hussam-22
          Hussam-22Feb 23, 2024

          I believe there is no alternative to react, all other major JS framework are far behind react in many aspects, having one single part of react that does not satisfy your requirements cant be solved by moving to another framework

          • Mitchell Mutandah
            Mitchell MutandahFeb 24, 2024

            You are correct, @hussam22. Finding an alternative to React is indeed very challenging.

            • András Tóth
              András TóthFeb 26, 2024

              I wish to find out for my own use cases there is or isn't a viable alternative. By viability I mean for an enterprise app you have everything: form handling, UI components, internationalization support.
              Funnily enough, react-query is already ported to solid-query. @tanstack is working on it.

              The decline may be slow, but it is good to be aware of it.

  • yogini16
    yogini16Feb 23, 2024

    Thank you for sharing !!

  • Kudzai Murimi
    Kudzai MurimiFeb 23, 2024

    Thanks for sharing Mitchell

  • Mike Ritchie
    Mike RitchieFeb 23, 2024

    Having the Form action be a function will also be super handy, versus an onSubmit handler, and it automatically uses the FormData object, which in many cases is all you need — no need for 2-way state binding in each of the fields

  • Chantal
    ChantalFeb 26, 2024

    Great share, @mitchiemt11 . Thank you very much.

  • Fatemeh Paghar
    Fatemeh PagharFeb 26, 2024

    🚀 I'm thrilled about these upcoming changes and have exciting plans for React 19 content updates! Let the React revolution begin!

  • Hakeem Abbas
    Hakeem AbbasMar 11, 2024

    Hey everyone! I'm super excited about the new features in React 19. I've actually written an article about it, breaking down what's changing and what it means for developers like us. If you're curious to learn more, check out my article React 19.

  • Simone Gentili
    Simone GentiliApr 9, 2024

    Please, ... could you suggest a way to install React Canary without using a framework?

Add comment