Desarrollo Web

Diferencias entre SPA y SSR

En ocasiones hay confusión entre las siglas de las nuevas tecnologías que van surgiendo. En este caso os ayudamos a distinguir entre SPA y SSR.

Publicado el 12 de Diciembre de 2019
Compartir

Qué es una SPA (Single Page Application)

Las SPA son páginas que se sirven siempre desde el mismo fichero, es decir, que se tienen que descargar antes de poder ejecutarse.

Esto tiene una mejora en cuanto a la experiencia de usuario, ya que el usuario tiene la sensación de estar navegando entre páginas de una manera muy rápida.

Una SPA no tiene páginas, tiene vistas, y aunque veamos que la URL va cambiando, realmente esto no es así, ya que se sirve todo desde la misma página.

Esto hace que, a día de hoy, los robots de indexación, como el de Google, tienen problemas para ejecutarlas, ya que no son capaces de hacerlo correctamente y mostrar todo el contenido HTML, por eso no son capaces de entenderlo y de indexarlas correctamente.

Este tipo de páginas se ejecutan siempre de lado del cliente, con sus cosas buenas y sus cosas negativas, ya que mejoran la experiencia de usuario, pero, en el caso de tener una conexión lenta, la descarga de esa página para acceder a ella puede ser un poco más tedioso.

Qué es una SRR (Server Side Rendering)

Las páginas de SSR, también llamadas páginas isomorfas, vienen a solucionar los problemas que tenían las páginas SPA.

Mejoran la indexación por parte de los robots, ya que el código HTML se sirve en una sola vez y los robots no tienen que ejecutar nada en JavaScript para poder obtenerlas.

Parte del renderizado se realiza por parte del servidor, lo que mejora mucho la performance de la aplicación, y hace que también que la indexación y el SEO (Search Engine Optimization) se mejore.


Compartir este post

También te puede interesar...

Code splitting en SPA con React

Code splitting en SPA con React

56 minutos y 7 segundos · Taller

Con este taller aprenderás a hacer code splitting correctamente en una SPA con React usando webpack y las herramientas que ofrece Reactjs.

  • Desarrollo Web
Artículos
Ver todos