Si el SEO es tu prioridad, no debes usar una Single Page Application. El Server Side Rendering es una muy buena opción, pero una opción mejor resulta ser los generadores de sitios estáticos.
¡SIEMPRE NECESITAS UN SERVIDOR!
Siempre necesitamos servidores para alojar nuestras aplicaciones. Incluso cuando nuestras aplicaciones solo son archivos estáticos (HTML, CSS, JS, imágenes, fuentes). Pero aún así nos confundimos. Pensamos que maquetar un sitio web significa dejar de lado los servidores.
¿Por qué nos confundimos?
Muchas herramientas como GitHub Pages nos facilitan el proceso de deploy de aplicaciones estáticas. Nos ahorran la configuración de los servidores. No nos permiten controlar cómo funcionan los servidores, solamente el contenido que estos van a alojar. Esto no es bueno ni malo. Solo depende de las necesidades y/o expectativas de tus proyectos.
Single Page Applications
Las Single Page Applications son páginas web que funcionarán extraordinariamente rápido, incluso cuando navegamos entre diferentes páginas. El problema es que todo este contenido estará disponible solo después de que los archivos de JavaScript terminen de cargar. Y este proceso puede tardar muchos segundos.
Estos archivos de JavaScript pueden ser muy pesados, ya que se encargan de todo el contenido y todas las rutas de nuestra aplicación. Afortunadamente, existen técnicas como el Code Splitting que nos permiten cargar la información de nuestra aplicación conforme los usuarios la van necesitando (por ejemplo, cuando navegan).
Aún con estas optimizaciones, la carga inicial de las SPAs es muy lenta. Los usuarios no verán contenido hasta que terminen de cargar los archivos de JavaScript. La ventaja es que luego de esperar, la aplicación funciona a toda velocidad.
Algunas veces también debemos encargarnos de la autenticación. Al no controlar el servidor, no tenemos forma de verificar si los usuarios están autenticados antes de que accedan a la aplicación. Así que debemos usar tokens (¡vivan los JSON Web Tokens!) para verificar la autenticación cada vez que hacemos peticiones a algún servidor.
Muchas herramientas como Create React App nos permiten crear Single Page Apps de forma rápida y sencilla.
Server Side Rendering
Las aplicaciones que implementan Server Side Rendering necesitan (obligatoriamente) configurar su servidor, ya que este es el encargado de “crear” un archivo HTML con todos los datos que haya pedido el usuario en una ruta específica.
La carga inicial de cada ruta es mucho más corto que en las Single Page Applications. Y también hay beneficios en el SEO. Pero el proceso de carga y descarga de información debe repetirse cada vez que los usuarios navegan por nuestra aplicación o deben consultar nuevos datos.
Afortunadamente, podemos crear una aplicación con SSR que se convierta en SPA cuando llegue al lado del cliente. Esto lo conocemos como Progressive Server Side Rendering. De esta forma, tanto la carga inicial como la navegación o interacciones de los usuarios funcionarán extraordinariamente rápido.
En la parte de la autenticación también podemos hacer combinaciones divertidas. Podemos aprovechar los momentos donde los usuarios recargan o cargan la página por primera vez. Guardamos la información de la autenticación en memoria o en una base de datos y hacemos seguimiento a los usuarios para determinar cuál es su estado de autenticación.
Algunas herramientas como Next.js nos ayudan a crear aplicaciones usando Server Side Rendering de forma extremadamente rápida y sencilla. Incluso han evolucionado hasta convertirse en frameworks de programación FullStack (frontend y backend).
Generadores de Sitios Estáticos
Los generadores de sitios estáticos combinan SSR y SPAs de forma asombrosa. Mientras desarrollamos, usamos un servidor para obtener nuestros datos. Pero justo antes de mandar a producción, renderizamos el contenido.
De esta forma, evitamos tener que renderizar nuestra aplicación desde el lado del cliente y del servidor. Solo necesitamos hacerlo una vez. Nuestros usuarios solo deben hacer alguna petición (como en SSR) para descargar un HTML con contenido y aprovechando que seguimos trabajando como SPA, cargar los archivos de JavaScript para navegar sin necesidad de recargar.
Si quieres probar una herramienta como estas, te recomiendo Gatsby. Cada vez es más popular. Y no es para menos, ya que podemos usar algunos plugins para integrarnos con diferentes herramientas y aprovechar todas las ventajas de este tipo de renderizado.