Cómo solucionar el error "Text content does not match server-rendered HTML" en Next.js App Router
Este error ocurre cuando el HTML generado en el servidor (SSR/SSG) no coincide con el árbol de React generado durante la primera renderización en el cliente. React detecta la inconsistencia durante el proceso de hydration y lanza una advertencia crítica que puede romper la funcionalidad de tu app.
Causa raíz
La mayoría de los casos provienen de código no idempotente entre SSR y CSR, es decir, código que produce resultados diferentes dependiendo de si se ejecuta en el servidor o en el navegador. Las causas más frecuentes:
Uso de Date.now(), new Date(), Math.random() o APIs dependientes del tiempo en el renderizado.
