Renderizado
Por defecto, Next.js pre-renderiza cada página. Esto significa que Next.js genera HTML para cada página por adelantado, en lugar de hacerlo todo mediante JavaScript del lado del cliente. El pre-renderizado puede resultar en un mejor rendimiento y SEO.
Cada HTML generado está asociado con el código JavaScript mínimo necesario para esa página. Cuando un navegador carga la página, su código JavaScript se ejecuta y hace que la página sea completamente interactiva (este proceso se llama hidratación en React).
Pre-renderizado
Next.js tiene dos formas de pre-renderizado: Generación Estática y Renderizado del Lado del Servidor (SSR). La diferencia está en cuándo se genera el HTML para una página.
- Generación Estática: El HTML se genera en el momento de compilación y se reutiliza en cada solicitud.
- Renderizado del Lado del Servidor (SSR): El HTML se genera en cada solicitud.
Es importante destacar que Next.js te permite elegir qué forma de pre-renderizado deseas usar para cada página. Puedes crear una aplicación Next.js "híbrida" usando Generación Estática para la mayoría de las páginas y Renderizado del Lado del Servidor (SSR) para otras.
Recomendamos usar Generación Estática en lugar de Renderizado del Lado del Servidor (SSR) por razones de rendimiento. Las páginas generadas estáticamente pueden almacenarse en caché por una CDN sin configuración adicional para mejorar el rendimiento. Sin embargo, en algunos casos, el Renderizado del Lado del Servidor (SSR) podría ser la única opción.
También puedes usar la obtención de datos del lado del cliente junto con Generación Estática o Renderizado del Lado del Servidor (SSR). Esto significa que algunas partes de una página pueden renderizarse completamente mediante JavaScript del lado del cliente. Para obtener más información, consulta la documentación sobre Obtención de Datos.