Hydration Proof

Search documentation

Find a page or section

Do hydration errors affect SEO?

Not directly. What they do to the page can.

Do hydration errors affect SEO? Not directly: Google does not describe hydration errors as a ranking factor, and it indexes the page as rendered in its browser. What they do to the page can matter, though: content that differs between server and client, metadata React never corrects, extra work that slows the page, and layout shift.

How Google sees a server-rendered React page

Google's JavaScript SEO basics describe three phases: crawling, rendering and indexing. Googlebot renders pages with "an evergreen version of Chromium", and indexing uses the rendered HTML. The same page also says that "server-side or pre-rendering is still a great idea because it makes your website faster for users and crawlers."

So Google sees roughly what a user's browser sees after hydration. A page that hydrates badly is not hidden from Google, but it is slower, and it may not say what the server HTML said.

Do hydration errors affect SEO directly?

Not according to anything Google documents. A hydration error is a message in the browser console. What Google describes evaluating is the result: the content it renders and the experience of the page. That is where hydration problems can show up.

The effects that can matter

What happensWhyCan it matter for search?
React renders a tree again on the clientIn React 19, a text or structure mismatch makes React throw away the server HTML for that treeMore main-thread work during load, which can hurt responsiveness and paint timing
Content changes after loadThe client renders different text than the server sentLayout shift, and a crawler that does not run JavaScript sees other content than one that does
An attribute stays wrongReact 19 keeps the server's attribute and does not patch itA wrong href, lang or alt stays in the page
<head> differsA title or meta tag rendered differently on the clientSearch engines and link previews can read different metadata
Interactivity breaksLost state and input when a branch is replacedAffects users; not a search signal on its own

Google's Core Web Vitals page says good Core Web Vitals align with what its core ranking systems seek to reward, alongside other page experience aspects. The targets are an LCP within 2.5 seconds, an INP under 200 milliseconds and a CLS under 0.1. A hydration mismatch does not guarantee a bad score, and fixing one does not guarantee a good one; it removes work and movement from the page.

Metadata is where a mismatch hurts most

The attributes Google relies on live in <head>: the canonical URL, hreflang alternates, robots directives, the title and the description. Google's JavaScript guide warns against changing the canonical URL with JavaScript to something other than the canonical in the original HTML, and notes that a noindex in the original HTML may stop Google from rendering the page at all.

If a <head> value differs between server and client, for example a title built from a browser-only value or an hreflang computed from the visitor's locale, the server HTML and the rendered page disagree about what the page is. hydration-proof reports a changed title, meta tag, stylesheet or script in <head> as HP1014, and how it works notes that React 19 adds a new <title> or <meta> instead of fixing the server one.

Check the pages that get indexed

Test the pages in your sitemap, in a production build, the way crawlers get them:

npx hydration-proof test --sitemap

--sitemap adds every route listed in your sitemap (it also reads robots.txt to find it). Fix head mismatches first, then text mismatches that make React re-render (HP1010 and HP1011), then attribute ones. Routes covers the other ways to choose pages.