hydration failed because the initial ui does not match what was rendered on the server

The process of "hydration" failed because the initial UI does not match what was rendered on the server. 1 This is because Next.js statically pre-renders the page and then when sent to the client, React "hydrates" the app. 1 This process renders the React virtual DOM and then checks it against the server-rendered HTML. 1 If the two do not match, hydration fails. 1