Investigación de MERJ y Vercel para aclarar el renderizado de Google con evidencia empírica
Entender cómo los motores de búsqueda rastrean, renderizan e indexan las páginas web es crucial para optimizar sitios para SEO (Optimización en Motores de Búsqueda). A medida que los motores de búsqueda como Google han evolucionado, especialmente en relación con el JavaScript del lado del cliente, ha habido una confusión general sobre qué prácticas son efectivas.
Mitos comunes sobre Google y JavaScript:
- “Google no puede renderizar JavaScript del lado del cliente.”
- “Google trata las páginas con JavaScript de manera diferente.”
- “La cola de renderizado y el tiempo de procesamiento afectan significativamente el SEO.”
- “Los sitios pesados en JavaScript tienen un descubrimiento de páginas más lento.”
Evolución de las capacidades de renderizado de Google
Antes de 2009: Soporte limitado para JavaScript
Inicialmente, Google solo indexaba contenido HTML estático, lo que dejaba invisible a Google gran parte del contenido generado por JavaScript.
2009–2015: Esquema de rastreo AJAX
Google introdujo un esquema que permitía a los sitios ofrecer “instantáneas” HTML del contenido generado dinámicamente. Aunque era una solución temporal, requería que los desarrolladores crearan versiones separadas y rastreables de sus páginas.
2015–2018: Renderizado temprano de JavaScript
Google comenzó a renderizar páginas usando un navegador Chrome sin interfaz (headless), lo que fue un gran avance. Sin embargo, esta versión temprana del navegador tenía limitaciones en el procesamiento de características modernas de JavaScript.
2018–presente: Capacidades modernas de renderizado
Hoy en día, Google utiliza una versión actualizada de Chrome para renderizar, manteniéndose al día con las tecnologías web más recientes. Los aspectos clave del sistema actual incluyen:
- Renderizado universal: Google intenta renderizar todas las páginas HTML, no solo un subconjunto.
- Navegador actualizado: Googlebot usa la versión estable más reciente de Chrome/Chromium, que soporta características modernas de JavaScript.
- Renderizado sin estado: Cada renderizado de página ocurre en una sesión de navegador nueva, sin retener cookies o estados de renderizados anteriores.
- Cloaking prohibido: Google no permite mostrar contenido diferente a los usuarios y a los motores de búsqueda para manipular los rankings. Es crucial optimizar el renderizado sin estado de tu aplicación para Google y personalizar a través de métodos con estado.
- Cacheo de activos: Google acelera el renderizado al cachear recursos, lo cual es útil para páginas que comparten recursos y para renderizados repetidos de la misma página.
Metodología
Para investigar los mitos mencionados, Vercel y MERJ analizaron más de 100,000 capturas de Googlebot a través de varios sitios, utilizando tecnologías como Edge Middleware para interceptar y analizar las solicitudes de los bots de los motores de búsqueda.
Recolección de datos:
Se inyectó una biblioteca JavaScript ligera en las respuestas HTML para bots, la cual, al terminar de renderizar una página, enviaba datos a un servidor de larga ejecución. Los datos incluían la URL de la página, un identificador único de la solicitud, y la marca de tiempo de la finalización del renderizado.
Análisis de datos:
Al comparar la solicitud inicial en los registros del servidor con los datos enviados desde nuestro middleware, se confirmó qué páginas fueron renderizadas correctamente por los motores de búsqueda y se analizaron los patrones en cómo se procesaron diferentes tipos de contenido y URLs.
Mitos Desmentidos
Mito 1: “Google no puede renderizar contenido JavaScript”
Nuestro análisis de más de 100,000 capturas de Googlebot confirmó que Google puede renderizar páginas complejas generadas con JavaScript. Se demostró que Googlebot pudo procesar e indexar contenido cargado dinámicamente, incluyendo componentes de servidor en React, sin problemas.
Mito 2: “Google trata las páginas con JavaScript de manera diferente”
Los experimentos demostraron que no hay una diferencia fundamental en cómo Google procesa páginas con JavaScript en comparación con HTML estático. Google renderiza todas las páginas HTML con estado 200, sin importar la complejidad del JavaScript.
Mito 3: “La cola de renderizado y el tiempo de procesamiento impactan significativamente el SEO”
Aunque existe una cola de renderizado, la mayoría de las páginas se renderizan en minutos, no en días o semanas. Solo un pequeño porcentaje experimenta retrasos significativos.
Mito 4: “Los sitios pesados en JavaScript tienen un descubrimiento de páginas más lento”
Google es capaz de descubrir y rastrear enlaces en páginas renderizadas con cualquier método, incluyendo la renderización del lado del cliente. Sin embargo, las páginas pre-renderizadas tienen una ligera ventaja en el descubrimiento de enlaces.
Implicaciones y Recomendaciones
Compatibilidad con JavaScript: Google puede renderizar y indexar contenido JavaScript, incluyendo aplicaciones SPA (Single Page Applications) y contenido cargado dinámicamente.
Paridad de renderizado: No hay diferencias fundamentales en cómo Google procesa las páginas pesadas en JavaScript en comparación con las páginas HTML estáticas.
Realidad de la cola de renderizado: Aunque existe, su impacto es menor de lo que se creía. La mayoría de las páginas se renderizan en minutos.
Descubrimiento de páginas: Los sitios pesados en JavaScript no están inherentemente en desventaja en el descubrimiento de páginas.
Recomendaciones:
- Aprovechar JavaScript: Usar libremente frameworks de JavaScript, priorizando siempre el rendimiento.
- Manejo de errores: Implementar límites de errores en aplicaciones React para evitar fallos de renderizado.
- Elementos críticos de SEO: Usar renderizado del lado del servidor o generación estática para etiquetas SEO críticas.
- Gestión de recursos: Asegurarse de que los recursos críticos no estén bloqueados por robots.txt.
- Actualizaciones de contenido: Asegurar que los cambios se reflejen en el HTML renderizado del servidor para una rápida reindexación.
- Estructura de enlaces internos y URLs: Crear una estructura de enlaces clara y lógica.
- Sitemaps: Usar y actualizar regularmente los sitemaps.
Google ha demostrado una capacidad avanzada para renderizar y procesar sitios pesados en JavaScript, lo que permite a los desarrolladores crear aplicaciones web modernas sin comprometer el SEO. La clave es optimizar el rendimiento de las aplicaciones y seguir las mejores prácticas recomendadas por Google para garantizar un descubrimiento y una indexación efectivos.
| Característica | Generación de Sitios Estáticos (SSG) | Regeneración Estática Incremental (ISR) | Renderizado en el Servidor (SSR) | Renderizado en el Cliente (CSR) |
|---|---|---|---|---|
| Eficiencia de rastreo: Qué tan rápido y efectivamente Google puede acceder, renderizar y recuperar páginas web. | Excelente | Excelente | Muy bueno | Pobre |
| Descubrimiento: El proceso de encontrar nuevas URL para rastrear* | Excelente | Excelente | Excelente | Promedio |
| Completitud del renderizado (errores, fallos, etc.): Qué tan precisa y completamente Google puede cargar y procesar tus páginas web sin errores. | Robusto | Robusto | Robusto | Podría fallar** |
| Tiempo de renderizado: Cuánto tiempo tarda Google en renderizar y procesar completamente las páginas web. | Excelente | Excelente | Excelente | Pobre |
| Evaluación de la estructura de enlaces: Cómo Google evalúa los enlaces para entender la arquitectura del sitio web y la importancia de las páginas. | Después de renderizar | Después de renderizar | Después de renderizar | Después de renderizar, los enlaces podrían faltar si el renderizado falla |
| Indexación: El proceso por el cual Google almacena y organiza el contenido de tu sitio. | Robusto | Robusto | Robusto | Podría no ser indexado si el renderizado falla |
* Tener un sitemap.xml actualizado reduce significativamente, si no elimina, las diferencias en el tiempo de descubrimiento entre los diferentes patrones de renderizado.
