Desarrollo web

Las soft navigations son cambios de vista en tu SPA que Chrome ya cuenta como navegación; desde octubre de 2026 afectan tus Core Web Vitals.

Qué son las soft navigations

Una soft navigation es un history.pushState() o la transición equivalente del router que Chrome acepta como navegación real: el usuario cambia de vista sin recargar el documento y el navegador vuelve a ejecutar su ciclo de medición sobre el nuevo contenido. No todo clic que cambia la URL califica: el nuevo contenido debe renderizarse y la transición debe parecerse a una navegación completa.

Antes de este cambio, las métricas de Chrome UX Report asociadas a una URL describían casi siempre la carga inicial. En una SPA eso era un problema: el usuario aterriza en /, navega a /productos, /productos/123 y /carrito, y el LCP del carrito no entraba en la cuenta. Con las soft navigations, cada vista tiene su propio LCP, su propio CLS acumulado y sus propias interacciones para el INP.

Chrome 151 introduce las APIs PerformanceSoftNavigation e InteractionContentfulPaint para exponer estos datos en el navegador. Hoy solo existen en Chrome: ni Firefox ni Safari las implementan, según el FAQ de web.dev. Eso no diluye el impacto, porque la medición de campo que Google usa en la búsqueda se apoya en el Chrome UX Report, que corre sobre Chrome.

Qué cambia en tu LCP, INP y CLS

Google confirmó el 13 de octubre de 2026, en las notas de versión de CrUX, la publicación de variantes experimentales de LCP, INP y CLS con soft navigations, consultables en la API de CrUX y en BigQuery. En ese mismo anuncio está la cifra que conviene retener: con las soft navigations incluidas, el porcentaje de sitios que aprueba Core Web Vitals pasa del 55,6% al 59,5%, un aumento relativo del 6,4%.

Ese número no significa que los sitios vayan a mejorar solos. Significa que, al repartir las métricas por vista en lugar de cargar todo sobre la primera, muchos sitios quedan mejor evaluados y otros peor. El efecto depende de cómo se comporte cada ruta:

  • LCP: deja de medir solo el primer pintado grande. Si tu vista de detalle monta un hero con datos que llegan por cliente, ese LCP ahora entra en la cuenta.
  • CLS: el desplazamiento que ocurre al montar la nueva vista (banners, imágenes sin dimensiones, skeleton que colapsa) se acumula donde antes no se acumulaba.
  • INP: ya medía interacciones durante toda la vida de la página, pero la atribución cambia: el clic que dispara la transición y el render posterior se evalúan en el contexto de la nueva vista.

En una SPA con router en cliente, el componente crítico suele ser el LCP de las vistas que dependen de datos: el fetch llega tarde, la imagen entra después y el navegador lo registra como pintado principal de esa soft navigation.

Cómo medir Core Web Vitals por ruta hoy

No esperes a mayo de 2027 para descubrir qué vista te está derrumbando el promedio. La librería web-vitals de Google ya emite cada métrica con su valor, su identificador y el tipo de navegación, y puedes agregarle la ruta actual:

npm install web-vitals

// main.js
import { onLCP, onINP, onCLS } from 'web-vitals';
const reportar = (metric) => {
fetch('/api/rendimiento', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
ruta: window.location.pathname,
nombre: metric.name,
valor: metric.value,
id: metric.id,
navegacion: metric.navigationType,
}),
});
};
onLCP(reportar, { reportAllChanges: true });
onINP(reportar, { reportAllChanges: true });
onCLS(reportar, { reportAllChanges: true });

reportAllChanges: true importa en LCP y CLS: sin él solo recibes el valor final y no ves el pico intermedio que suele explicar el problema. Con la ruta en el payload, en dos semanas tienes un ranking de vistas que te dice dónde intervenir.

Verificarlo en DevTools mientras navegas

Para validar sin instalar colectores, abre DevTools, entra a la pestaña Performance y graba mientras haces clic por clic entre rutas. En la pista de Web Vitals verás los marcadores de LCP, CLS e INP con su marca de tiempo: lo que quieres comprobar es que cada transición de vista produce sus propios eventos y no solo los de la carga inicial. Si una ruta no deja marcadores, esa vista no se está renderizando como navegación y Chrome no la contará como tal.

Consultar las métricas experimentales en CrUX y BigQuery

Las variantes experimentales ya están consultables en BigQuery sobre el dataset público chrome-ux_report y a través de la API de CrUX. El nombre exacto de las tablas experimentales lo publica Google en sus notas de versión: tómalo de ahí y no de artículos de terceros, porque esas tablas conviven con las métricas oficiales y mezclarlas arruina cualquier comparación.

La forma práctica de usarlas: elige una URL representativa de tu SPA, consulta las métricas experimentales por origen y forma (desktop o móvil) y compáralas contra las métricas normales del mismo periodo. La diferencia entre ambas columnas es, exactamente, lo que las soft navigations van a sumar o restar a tu evaluación cuando se gradúen.

El plazo de mayo de 2027 y cómo ordenar el trabajo

Google fijó mayo de 2027 como objetivo de graduación. Mientras tanto, las métricas con soft navigations son experimentales: se publican para medir y recoger retroalimentación, pero no sustituyen a las métricas oficiales de Search Console ni a los umbrales vigentes de Core Web Vitals.

Ese plazo ordena el trabajo en tres bloques:

  1. Ahora: instrumenta web-vitals con la ruta y guarda el histórico. Sin datos previos no podrás comparar cuando llegue el cambio.
  2. Antes de 2027: ataca las vistas con peor LCP o CLS por ruta (imágenes sin ancho y alto, datos que empujan el layout, fuentes bloqueantes). Es el mismo trabajo que ya hacías, solo que ahora sabes qué vista te está costando.
  3. Al graduar: vuelve a comparar métricas experimentales contra oficiales para confirmar que tu sitio no cruzó ningún umbral.

Lo que no conviene es esperar a que el dato aparezca en Search Console para reaccionar: cuando llegue ahí ya estará afectando la evaluación de tu sitio, y recuperar percentiles toma meses.

Preguntas frecuentes

¿Las soft navigations afectan ya mi posicionamiento en Google?

No. Las variantes experimentales son visibles en CrUX y BigQuery, pero las métricas con las que Google evalúa tu sitio siguen siendo las oficiales. El impacto llegará cuando se gradúen, con objetivo en mayo de 2027.

¿Sirve la librería web-vitals si mi SPA ya usa React o Next.js?

Sí. La librería es agnóstica del framework y reporta cada métrica con su valor y su tipo de navegación; solo hace falta agregar la ruta actual al payload. En Next.js con App Router, además, las recargas de datos por ruta ya generan actividad medible sin tocar el router.

¿Por qué en Firefox o Safari no veo las nuevas APIs?

Porque PerformanceSoftNavigation e InteractionContentfulPaint se introdujeron en Chrome 151 y hoy no tienen implementación en otros navegadores. La medición de campo de Google se apoya en Chrome a través de CrUX, así que la ausencia en Firefox no te exime de la medición.

¿Cómo sé si Chrome considera mis rutas como soft navigations?

Graba con la pestaña Performance de DevTools mientras navegas en cliente: cada vista aceptada como navegación propia deja marcadores de Web Vitals en la grabación. Si solo aparecen eventos al recargar, tus transiciones no están calificando.

¿Las métricas experimentales mejoran o empeoran mi sitio?

Ninguna de las dos por sí solas: redistribuyen las métricas por vista. Según el anuncio de Google, la proporción global de sitios que aprueba Core Web Vitals sube del 55,6% al 59,5% con soft navigations incluidas, pero tu sitio puede moverse en cualquier dirección según el comportamiento de cada ruta.

El siguiente paso concreto: instala web-vitals con el snippet de arriba en tu SPA, deja correr el colector dos semanas y ordena las rutas por LCP; con esa lista ya tienes el plan de trabajo antes de que Google gradúe las soft navigations.

Compartir