Todo bien, pero por qué la puntuación de PageSpeed Insights sale tan baja
La frase que quienes desarrollamos para la web odiamos escuchar.
La última semana la dediqué a encontrar un equilibrio entre tener una SPA que carga una vez y después se usa con fluidez, y a la vez sea amigable para SEO y rastreadores, admita enlaces profundos y además obtenga buenas puntuaciones en PageSpeed Insights.
En muy poco tiempo volví al campo de batalla de SEO vs velocidad vs funcionalidad, una especie de elige dos.
Pequeña lección de historia: en los buenos tiempos del desarrollo web con php, modperl o archivos estáticos, el servidor disparaba la página directamente al navegador. La vida estaba llena de tablas y era sencilla. Más o menos.
Luego llegaron los frameworks modernos como React y tres docenas de competidores. De repente todo trataba sobre hidratación, shadow DOM y componentes reutilizables. Apenas llegaba HTML reconocible al navegador. En su lugar llegaban grandes bloques de JS, con flashes de contenido sin estilos y otras molestias.
También llegaron los problemas de rastreadores que no podían interpretar tu contenido cargado a golpe de JavaScript, y con ello malas puntuaciones en Lighthouse.
Durante un tiempo Google promovió una solución: renderbot. Un Chrome en una caja, residente en tu servidor, que renderizaba páginas complejas y entregaba HTML final a rastreadores sencillos. Sonaba bien si fuera plug and play, pero el diablo estaba en los detalles. Hoy renderbot es render-not, deprecado y sin soporte activo.
Una salida tentadora es rendirse y generar un árbol estático de URLs HTML que cualquier araña pueda rastrear. Sabe a poco, pero es la realidad para muchos sitios cuando los bots se ven desbordados tratando de recomponer una página que solo necesita unos H1, H3 y un párrafo, tras mil instrucciones de JavaScript.
Entra en escena el renderizado del lado del servidor. Todo lo viejo vuelve. Volvemos a construir páginas completas en el servidor y enviarlas al cliente, donde los toques glamorosos se activan con pizcas de JavaScript tardío.
Pero si no tienes tu apuesta principal hecha en React, Svelte, Vue, Next o la plataforma de moda, pulsar un hipotético interruptor de activar SSR rara vez es opción. Entonces qué hacer
En mi caso con satellitemap.space, un sitio y herramienta de información satelital, necesitaba un conjunto de URLs aptas para buscadores que llevasen directo a satélites y constelaciones. Es como mucha gente empieza sus consultas: dónde está la ISS, dónde reingresó ese Starlink.
Ya tenía enlaces profundos a satélites, pero PageSpeed Insights se negaba a considerar la página interactiva hasta que se estabilizara todo el tráfico de red. Resultado: URLs útiles que abrían la SPA en un modo concreto, con mala nota. Un enlace profundo a la ISS era usable en mi móvil en pocos segundos, pero Google lo calificaba de suspenso.
Peor aún, la información SEO de un deep-link en una SPA debería concentrarse en el HEAD: título, meta tags, etc. Aunque pueden reescribirse tras cargar, los rastreadores más simples no siempre esperan.
La solución fue Astro. Me permitió construir páginas desde cualquier patrón de URL en el servidor, incluir secciones impulsadas por JS complejo y aun así alcanzar puntuaciones de Lighthouse por encima de 90. Pude seguir usando tailwindcss y los módulos de JS de la SPA, todo familiar, sin reescribirlo todo desde cero.
Como resultado pude ofrecer un catálogo de satélites en URLs como sat y norad_id con cabeceras y contenido SEO, y con una carga que a ojos de Lighthouse es fulminante.
El truco de Astro está en hidratar solo las secciones cuando son visibles o tras la primera interacción. En una página de satélite concreto, eso significa icono de búsqueda, el globo 3D, los acordeones de descripción, las pasadas por el cielo y cualquier otro módulo que decida activar.
Así, la carga inicial es mínima, una página ultrafina. Al hacer scroll, se inicia la visualización del globo, más ligera que bibliotecas más pesadas. Al pulsar buscar, arranca el buscador incremental. Nada de esto le importa a los rastreadores.
Otra alternativa similar es Qwik con Qwik City, probablemente aún más veloz. Pero lo perfecto es enemigo de lo bueno. La meta no es pasar de 95 a 100, sino dejar de recibir un suspenso.
Conclusión práctica: Astro funciona de maravilla y lo usaré también para páginas de constelaciones y más.
Si tu organización necesita equilibrar rendimiento, SEO y funcionalidad con enfoque empresarial, en Q2BSTUDIO te ayudamos a construir experiencias web y móviles con aplicaciones a medida y software a medida, integrando prácticas modernas como SSR, islas de hidratación y optimización de Core Web Vitals. Descubre cómo impulsamos proyectos end to end con aplicaciones a medida y cómo aplicamos IA para empresas para personalizar buscadores, recomendaciones y agentes IA.
Somos especialistas en inteligencia artificial, ciberseguridad, pentesting, servicios cloud AWS y Azure, servicios inteligencia de negocio y power bi, además de automatización de procesos. Diseñamos arquitecturas escalables, seguras y rápidas, combinando auditorías de rendimiento con prácticas de ciberseguridad, observabilidad y despliegues en la nube. Si buscas acelerar tu web sin sacrificar funcionalidad, alinear SEO técnico con tu estrategia de datos y convertir métricas en crecimiento real, hablemos y demos el siguiente paso juntos.