Cuando tenemos una web multi-idioma, la tentación es grande: “¿Y si cargo en segundo plano (prefetch) todos los idiomas nada más entrar para que el cambio sea instantáneo?”
El Coste Oculto del “Eager Loading”
Cargar masivamente páginas que el usuario quizás nunca visite tiene consecuencias:
- Desperdicio de Datos: Si un usuario entra en español y nunca cambia, has descargado el doble o triple de peso inútilmente.
- Batería y CPU: El navegador tiene que parsear y procesar esos recursos extra.
- Saturación: Si tu web tiene muchas imágenes, el prefetch agresivo compite por el ancho de banda con el contenido que el usuario sí está viendo ahora mismo.
La Estrategia Inteligente: Prefetch on Hover
Astro ofrece una solución perfecta que anticipa la intención en lugar de asumir el comportamiento.
html
<a href="/en" data-astro-prefetch="hover">
English
</a><a href="/en" data-astro-prefetch="hover">
English
</a>- El usuario mueve el ratón hacia el botón de idioma (intención clara).
- En ese instante (
hover), Astro descarga la página destino. - Tardan unos ~200ms en hacer clic. Para entonces, la página ya está en caché.
Resultado
Obtienes la misma sensación de navegación instantánea (0ms) pero solo consumes recursos cuando hay una alta probabilidad de que el usuario los necesite. Es el equilibrio perfecto.