React 19: the features I actually use

React 19 shipped a lot. Most of the writing about it focuses on what's possible. This is about what's worth using now, on real client projects, where stability matters.

Actions replace half the async boilerplate

Before React 19, a form submission meant useState for loading, useState for errors, a try/catch, and usually a useEffect watching the result. Actions collapse that:

async function submitEnquiry(formData: FormData) {
  "use server";
  const name = formData.get("name") as string;
  await sendEnquiryEmail(name);
}
 
export function ContactForm() {
  return (
    <form action={submitEnquiry}>
      <input name="name" type="text" />
      <button type="submit">Send</button>
    </form>
  );
}

The server action handles the mutation. React handles the pending state. The component stays clean.

use() makes async data feel synchronous

Reading a promise inside a component used to mean useEffect plus useState plus a loading check. The use() hook lets you read the resolved value directly, paired with Suspense for the loading state:

function ProjectList({ projectsPromise }: { projectsPromise: Promise<Project[]> }) {
  const projects = use(projectsPromise);
  return projects.map(p => <ProjectCard key={p.id} project={p} />);
}

Wrap it in <Suspense fallback={<Skeleton />}> and the loading state is handled one level up. The component stays focused on rendering.

useOptimistic for instant-feeling UIs

Waiting for a server round-trip before updating the UI feels slow, even if it isn't. useOptimistic lets you apply the expected state immediately and roll back if something goes wrong:

const [optimisticItems, addOptimistic] = useOptimistic(items);
 
async function handleAdd(newItem: Item) {
  addOptimistic([...optimisticItems, newItem]);
  await saveToDatabase(newItem);
}

The user sees their action reflected instantly. If the server call fails, React reverts. It's one of those APIs that makes the experience feel snappier without any real performance change.

What I'm still not using

The Document Metadata API (<title>, <meta> inside components) is interesting but Next.js already solves this well with its metadata export. Adding another approach to the same problem isn't worth the confusion.

React 19 is a solid upgrade. The three patterns above show up in almost every project now, and they genuinely reduce the code I have to write and maintain.