Nivel Principiante
Imagina que quieres visitar la página web de un restaurante. En lugar de que tu teléfono tenga que armar la página desde cero, el restaurante (el servidor) ya tiene una foto lista de la página completa y te la envía de inmediato. SSR es ese proceso: el servidor ya prepara la página con todo el contenido, haciendo que se vea mucho más rápido en tu pantalla, especialmente si no tienes una buena conexión.
Nivel Intermedio
SSR (Server-Side Rendering), o Renderizado del Lado del Servidor, es una técnica de desarrollo web donde la página HTML se genera completamente en el servidor antes de ser enviada al navegador del cliente. En este modelo, el servidor procesa el contenido, los datos de la aplicación y la lógica del frontend (usando frameworks como React, Vue o Next.js) para crear el HTML final. El navegador recibe este HTML ya renderizado y puede mostrar el contenido de forma casi instantánea.
Esta técnica contrasta con el Client-Side Rendering (CSR), donde el navegador recibe un archivo HTML casi vacío y es el encargado de descargar y ejecutar el código JavaScript para generar la página. El SSR es muy beneficioso para la SEO, ya que los rastreadores de los motores de búsqueda pueden ver y entender el contenido completo de la página sin tener que ejecutar JavaScript.
Nivel Avanzado
Técnicamente, el SSR es un pilar fundamental en la arquitectura de aplicaciones web modernas, especialmente en el contexto de frameworks de JavaScript. El proceso de SSR involucra:
- Solicitud del Cliente: El navegador envía una solicitud HTTP al servidor.
- Renderizado en el Servidor: El servidor recibe la solicitud, recupera los datos necesarios (por ejemplo, desde una base de datos o una API) y utiliza el mismo código de la aplicación de frontend para generar la página HTML.
- Envío de HTML: El servidor responde al cliente con el HTML completamente renderizado, junto con los archivos CSS y JavaScript necesarios.
- Hidratación (Hydration): Una vez que el navegador ha renderizado la página y los archivos de JavaScript se han cargado, el código del lado del cliente «toma el control» del HTML estático, adjuntando oyentes de eventos y haciendo que la página sea interactiva. Este proceso es conocido como hidratación.
Las ventajas clave del SSR incluyen una mejor velocidad de carga inicial y un SEO superior debido a que los rastreadores no tienen problemas para indexar el contenido. Sin embargo, puede aumentar la carga del servidor y el tiempo de respuesta inicial del servidor, ya que debe generar la página en cada solicitud. La elección entre SSR y CSR a menudo se mitiga con estrategias híbridas, como el Renderizado Estático (SSG) para contenido que no cambia frecuentemente, y el SSR para el contenido dinámico.
« Volver al índice del glosario