Minified React error #425

Minified React error #425 means text in a React 18 production page did not match the server HTML. Find the changed text in development or with a browser check, then make the first render use the same value on both sides.

The error

Minified React error #425; visit https://reactjs.org/docs/error-decoder.html?invariant=425 for the full message or use the non-minified dev environment for full errors and additional helpful warnings.

#423 or #422 may follow to describe whether React re-rendered the root or one Suspense boundary.

The full message is:

Text content does not match server-rendered HTML.

React 19 uses #418 for text mismatches. #425 points to React 18.

What minified React error #425 means

React error 425 does not include the differing values. In development, the warning can show both:

Warning: Text content did not match. Server: "5:00 AM" Client: "10:00 AM"

If development does not reproduce it, compare the production page. Check timezone, locale, and whether the server HTML was built or cached earlier.

Common causes

How to fix it

1. Find the text. Read React's development warning or check the production page with hydration-proof.

2. Use matching inputs. This example formats a time in each runtime's default timezone:

   TypeScriptJavaScript

   "use client";
    
   export function SignedInAt({ at }: { at: string }) {
     return <p>Signed in at {new Date(at).toLocaleTimeString()}</p>;
   }

   Copy

   Pass an explicit locale and a timezone chosen by the server:

   TypeScriptJavaScript

   "use client";
    
   export function SignedInAt({
     at,
     timeZone,
   }: {
     at: string;
     timeZone: string;
   }) {
     const time = new Date(at).toLocaleTimeString("en-US", { timeZone });
     return <p>Signed in at {time}</p>;
   }

   Copy

3. Delay live values such as a clock until after hydration. See two-pass rendering.

Find every instance

hydration-proof reports changed text as HP1001, with both values:

npx hydration-proof test --probe

--probe changes one factor at a time to test the cause. The ESLint rules no-date-in-render and no-timezone-without-explicit-timezone catch the code before it ships.

Related

• Text content does not match server-rendered HTML
• Minified React error #418
• Minified React errors 418, 423 and 425 compared
• Timezone hydration mismatches
• HP1001: text differs between server and client