Cómo mejorar el tiempo de carga de tu web

El impacto de la velocidad

Según Google, el 53% de los usuarios abandona una web si tarda más de 3 segundos en cargar. Cada segundo extra reduce las conversiones un 7%.

1. Optimiza las imágenes

Las imágenes suelen ser el recurso más pesado. Estrategias:

Usa formatos WebP o AVIF en lugar de JPEG/PNG

Implementa lazy loading con loading="lazy"

Sirve imágenes en tamaños adecuados con srcset

Comprime con herramientas como Sharp o Squoosh

2. Minimiza CSS y JavaScript

Usa herramientas de build como Vite o Webpack para minificar y tree-shake el código. Elimina CSS no utilizado con PurgeCSS.

3. Activa la compresión del servidor

Configura Brotli (preferido) o Gzip en tu servidor web. En Nginx:

gzip on;

gzip_types text/css application/javascript application/json;

brotli on;

brotli_types text/css application/javascript;

4. Usa un CDN

Un Content Delivery Network sirve los archivos desde el servidor más cercano al usuario. Cloudflare, Vercel Edge o AWS CloudFront reducen la latencia significativamente.

5. Cache del navegador

Configura headers de cache para recursos estáticos:

Cache-Control: public, max-age=31536000, immutable

Los archivos con hash en el nombre (ej: app.a1b2c3.js) pueden cachearse indefinidamente.

6. Reduce las peticiones HTTP

Combina archivos CSS y JS. Usa sprites o iconos SVG inline en lugar de múltiples imágenes pequeñas. Elimina scripts de terceros innecesarios.

7. Precarga recursos críticos

Usa <link rel="preload"> para fuentes y CSS crítico. <link rel="preconnect"> para dominios de terceros (Google Fonts, analytics, etc.).

8. Renderizado en el servidor (SSR/SSG)

Frameworks como Next.js pueden generar HTML en el servidor, enviando contenido visible inmediatamente sin esperar a que JavaScript se ejecute.

9. Elimina plugins innecesarios

En WordPress, cada plugin añade CSS y JS. Audita regularmente y elimina los que no uses. Considera migrar a una solución React/Next.js para máximo rendimiento.

---

En Tonwy todas nuestras webs puntúan 90+ en Lighthouse. Si tu web va lenta, podemos ayudarte.