While not expected to be released until later in 2024, React 19 has been announced and with some interesting new hooks to boot! Handling forms is an essential but often tedious task in web development, so any tool that is able to shortcut that work could be very useful. The four new hooks that will be coming with the release of React 19 will do just that. Say hello to useOptimistic, useFormStatus, useFormState, and simply, use. These new hooks provide different ways to give feedback to the user when they click submit.

useOptimistic allows you to manipulate the state while performing and waiting for a server action to finish. This means you can show some temporary text easily while an action is performed, but the response has not yet been received.

useFormStatus acts similarly, but instead of actually takes the status of the last form submission and returns different properties that you can access and manipulate to provide feedback about the state of a form submission such as “pending” and updates the UI.

useFormState actually lets you manage the state inside the form itself before JavaScript has even run on the client side.

use is a hook that can be called inside a component to grab the value of a resource. This means you can grab values located in a promise or even use it inside a conditional statement or loop which is unique among all other React hooks.

These hooks all achieve similar goals, but go about it different ways and provide their own situational value depending on what you need for a project.