El efecto de las Core Web Vitals en tu SPA según el nuevo algoritmo de Google

A menudo nos encontramos con numerosos y complejos términos en el mundo de la tecnología, los cuales debemos tener interiorizar para poder sacar todo el partido posible a una página web y, por ende, a un negocio. Aquí, queremos hablar sobre dos conceptos fundamentales: los Core Web Vitals y una web construida con arquitectura SPA —Single Page Application, por sus siglas en inglés; o aplicación de una sola página, en español—.

La actualización del algoritmo de Google supondrá una nueva forma en la que una página web con arquitectura SPA es analizada para el ranking del famoso buscador. Desde mayo de 2021, las métricas en relación con los Core Web Vitals, es decir, los indicadores de Google para medir el rendimiento de una web, estarán incluidas en el algoritmo. Para algunos, podría no reflejar de manera muy precisa la experiencia del usuario en este tipo de páginas web.

Para poder entender por qué los indicadores Core Web Vitals pueden no reflejar la realidad al completo, es preciso que conozcamos cómo funciona una web Single Page Application y qué podría significar el nuevo algoritmo para el posicionamiento de una web en Google. A fin de cuentas, todos queremos aparecer en la primera página cuando buscan nuestros productos y servicios.

¿Qué es una página web SPA o Single Page Application?

Una página web SPA (Single Page Application) está construida, como el propio nombre indica, sobre una única aplicación de JavaScript. A diferencia de una web tradicional con múltiples páginas que se solicitan del servidor en su totalidad, una web SPA únicamente extrae aquellas partes que son necesarias. Los códigos sobre las que está construida —HTML, CSS y JavaScript— se cargan una sola vez o cargan parcialmente en respuesta a las acciones concretas de un usuario.

El objetivo principal de este tipo de páginas web es proporcionar una fluidez mayor a los usuarios, evitando tiempos de carga innecesarios y permitiendo una navegabilidad más dinámica, al no tener que cargar todos los contenidos en repetidas ocasiones. El proceso típico al acceder a una web construida con arquitectura SPA es el siguiente:

1. Se accede a la web con su URL.
2. Aparece una animación de carga antes de entrar a la página principal.
3. La web construida en su totalidad con JavaScript carga de una sola vez.
4. Se muestra el contenido inicial.
5. Aquello donde el usuario quiera acceder se actualiza con las nuevas peticiones del servidor, pero no precisa volver a cargar enteramente.

En los últimos cinco años, este modelo ha comenzado a ser relevante y este tipo de arquitectura web está ganando adeptos, ya que ofrece una mejor experiencia del usuario y puede separar tanto el front end como el back end de manera efectiva para los desarrolladores web. Por supuesto, no hay un pro sin su contra, y es que el tiempo de carga inicial puede llegar a ser más elevado, ya que necesita cargar todo el código de JavaScript de antemano, haciendo sufrir a la puntuación SEO. Es aquí donde entran en escena los Core Web Vitals.

La importancia de los Core Web Vitals en relación con una web SPA

Los Core Web Vitals son los indicadores que miden la experiencia de los usuarios en una web para posicionarlas en los resultados de la búsqueda de Google según su rendimiento. Con ellas, buscan medir los siguientes conceptos, los cuales se tendrán en cuenta para la actualización del algoritmo de posicionamiento.

Largest Contentful Paint (LCD)

Esta métrica mide la velocidad de carga percibida o Largest Contentful Paint (LCD). Determinará cuál es el momento en el que el contenido principal se ha cargado por completo y comienza a ser de utilidad para los usuarios. Según Google, los desarrolladores web deberán conseguir el objetivo de carga completa de la web en un tiempo de 2,5 segundos, para así tener una puntuación óptima en LCD.

• De 0 a 2,5 segundos: buena
• De 2,5 segundos a 4 segundos: necesita mejora
• De 4 segundos en adelante: mala

First Input Delay (FID)

Las páginas deben alcanzar un FID de menos de 100 milisegundos. La métrica quiere medir el tiempo que tarda la página web en responder por primera vez, cuantificando la experiencia del usuario al comenzar a interactuar con las páginas. En general, cuando el hilo principal de navegación no responde al usuario, es porque se encuentra ocupado haciendo otra cosa. Según Google, esto último también puede ocurrir porque el navegador está ocupado analizando y ejecutando un archivo grande de JavaScript por alguna aplicación.

Cumulative Layout Shift (CLS)

El CLS mide la estabilidad visual respecto a los cambios de diseño inesperados del contenido de una web. Básicamente intenta penalizar a aquellas páginas web que se mueven antes de poder hacer clic en un sitio que el usuario ya tenía fichado, un anuncio de terceros que se redimensiona desajustando el texto, o aquellos recursos que se cargan de forma desordenada; algo que nos recuerda a nuestra propia experiencia como usuarios en ciertas páginas.

Por qué los Core Web Vitals pueden no reflejar una experiencia de usuario realista

Varias de las razones principales por la que los indicadores Core Web Vitals pueden resultar injustas para el posicionamiento en Google de tu web SPA son las siguientes:

1. No analizan el rendimiento de las páginas subsiguientes. Por mucho que pongas tu empeño en el rendimiento de las páginas subsiguientes a la inicial, es decir, intentar que, aunque tus métricas de la página de inicio sean algo mediocres —pero haciendo una experiencia de usuario más agradable para las siguientes secciones— Google no lo tendrá en cuenta más allá del LCP inicial.
2. Un problema de diseño aislado puede afectar a toda la puntuación. El CLS es una métrica acumulativa para la estabilidad visual y de diseño de una página web. Un simple error o problema de diseño puede afectar a toda tu puntuación, penalizando tu ranking en Google.
3. Google admite su limitación. Google admitió que los Core Web Vitals tienen sus limitaciones para las webs con arquitectura SPA. Aunque han prometido seguir trabajando en ellas, solo te queda ser consciente de ellas, analizar a tu competencia e invertir en la optimización de tu web. Ante todo, no debemos olvidar que la web debe primero satisfacer al usuario.

¿Cómo podemos ayudarte?

Si necesitas más información no dudes en ponerte en contacto con nosotros.