---
title: "Hydration"
description: "Debug hydration mismatches with a side-by-side diff of the server-rendered and client-side HTML."
canonical_url: "https://nuxt.com/modules/hints/hydration"
---
# Hydration

> Debug hydration mismatches with a side-by-side diff of the server-rendered and client-side HTML.

Debug hydration mismatches with a powerful side-by-side diff viewer. See the exact differences between the server-rendered HTML and the client-side result.

![Hydration panel in the Nuxt DevTools](https://nuxt.com/modules/hints/images/devtools-hydration.png)

## How it works

The module hooks into Vue's hydration process to compare the server-rendered DOM with the client-side DOM. When a mismatch is detected, it captures the pre- and post-hydration HTML for inspection.


## Sitemap

See the full [sitemap](https://nuxt.com/sitemap.md) for all pages.