React 19 became stable on December 5, 2024. Most release coverage focused on Server Components and new hooks, which matter a lot if you are building a large application. If you run a marketing site, a customer portal or a content-heavy React frontend, the questions are simpler: what gets better, what might break, and when should you upgrade?

The changes that matter for most sites

Forms get much simpler

Forms are where React 19 makes the biggest everyday difference. Until now, a typical contact or signup form needed custom code to track whether it was submitting, show errors, disable the button and reset afterwards. Teams often added a form library just to manage that.

React 19 introduces Actions: you can pass an async function to a form, and React manages the pending state, errors and updates for you. New hooks support this pattern:

  • useActionState keeps track of the result of a form action, such as a success message or validation errors.
  • useFormStatus lets a button or other component inside a form know whether the form is currently submitting.
  • useOptimistic lets you show the expected result immediately, for example a comment appearing in a list, while the request is still in flight.

For business sites with contact forms, quote requests and newsletter signups, this means less custom code and fewer dependencies.

Page metadata without extra libraries

Components can now render <title>, <meta> and <link> tags directly, and React moves them into the document head. Previously this usually required a library such as React Helmet. If your framework already handles metadata for you, little changes. If you were managing it yourself, React 19 removes a dependency.

Better control over loading resources

React 19 adds APIs for preloading fonts, scripts and stylesheets, and it handles stylesheet ordering more reliably. These are small changes, but they help with the kind of loading issues that affect Core Web Vitals.

Smaller quality-of-life changes

  • ref can now be passed as a normal prop, so most uses of forwardRef are no longer needed.
  • Hydration errors, the confusing warnings you get when server and browser output differ, now come with much clearer messages.
  • <Context> can be used directly as a provider.

These do not change what your users see, but they make the code easier to maintain.

Server Components: important, but not for every site

React Server Components let parts of a page run only on the server, sending HTML and data to the browser without the JavaScript that produced them. For data-heavy sites this can reduce the amount of JavaScript visitors download.

They are now stable in React 19, but you use them through a framework that supports them, such as Next.js with the App Router. If your site is built with a framework that does not support Server Components, or with a plain client-side React setup, you can upgrade to React 19 and ignore them entirely.

What the React Compiler is

The React Compiler is a separate tool from the React team that automatically adds the memoization developers usually write by hand with useMemo, useCallback and memo. It can make interfaces more responsive without code changes.

It is released separately from React 19 and was still before its 1.0 release at the time of writing. It is worth trying on a branch, but we would not make it a requirement for upgrading.

What can break

React 19 removes several APIs that were deprecated for a long time. The ones we see most often in older codebases are:

  • ReactDOM.render and ReactDOM.hydrate, replaced by createRoot and hydrateRoot.
  • propTypes and defaultProps on function components. Default values should move to normal JavaScript default parameters.
  • String refs and the legacy context API in class components.
  • Some testing utilities, including react-test-renderer, which is deprecated.

The bigger risk is usually not your own code but your dependencies. UI component libraries, form libraries and older plugins may not support React 19 yet, and your framework has to support it too.

How to upgrade

  1. Upgrade to React 18.3 first. It is functionally the same as 18.2 but adds warnings for everything that React 19 removes.
  2. Fix the warnings. The React team provides codemods that automate many of the changes.
  3. Check every dependency that relies on React, especially component libraries, and confirm they support version 19.
  4. Confirm your framework supports React 19. If it does not yet, wait for it.
  5. Upgrade on a branch, run your tests, and click through the key user journeys, especially forms.

Should you upgrade now?

For actively developed React applications on a framework that supports it, yes, plan the upgrade this year. The form and metadata improvements alone simplify a lot of everyday code.

For a stable marketing site that rarely changes, there is no urgency. React 18 continues to work. Fix the deprecation warnings when you next do maintenance, so the eventual upgrade is small.

If your site is held back because a framework or library does not support React 19, treat that as useful information about the health of that dependency.

Planning a React upgrade? Contact us and we will check your codebase and dependencies before you commit to a date.