React 19 Stable: Actions, use() Hook, and Server Components

The React team has released React 19 as stable, bringing the most significant API additions since hooks were introduced in React 16.8.

Actions and useActionState

function UpdateName() {
    const [error, submitAction, isPending] = useActionState(
        async (prev, formData) => {
            const error = await updateName(formData.get('name'));
            if (error) return error;
            redirect('/profile');
        },
        null,
    );

    return (
        <form action={submitAction}>
            <input name="name" />
            <button disabled={isPending}>Update</button>
            {error && <p>{error}</p>}
        </form>
    );
}

The use() Hook

The new use() hook reads a value from a Promise or Context, and unlike other hooks it can be called conditionally:

function Comments({ commentsPromise }) {
    const comments = use(commentsPromise);
    return comments.map(c => <p key={c.id}>{c.text}</p>);
}

Server Components

React Server Components are now stable in React 19. Components that render only on the server can fetch data directly without adding to the JavaScript bundle sent to the browser.