Caso de estudio · Rendimiento ecommerce
De 49 segundos a 2,4
Rebuild del frontend de una tienda online real de alimentación artesana. Mismo contenido, misma marca, otra técnica.
El punto de partida
Una tienda online española real de alimentación artesana, construida sobre PrestaShop 1.6 con un tema de hace una década: jQuery de 2015, imágenes sin optimizar y un DOM de más de 7.500 elementos.
El dato clave del diagnóstico: su servidor respondía en 220 ms — rápido. El 100 % del problema estaba en el frontend. La página donde el cliente decide comprar tardaba casi un minuto en estar lista en móvil.
Los números
Portada
| Métrica | Antes | Después | Mejora |
|---|---|---|---|
| Performance (móvil) | 8/100 | 93/100 | +85 puntos |
| Contenido principal visible (LCP) | 49,1 s | 2,4 s | 20× más rápido |
| Primer contenido (FCP) | 15,9 s | 0,9 s | 17× más rápido |
| Peso de página | 16,7 MB | 364 KB | 46× más ligera |
| Saltos de layout (CLS) | 0,357 | 0 | Perfecto |
Ficha de producto
| Métrica | Antes | Después | Mejora |
|---|---|---|---|
| Performance (móvil) | 26/100 | 99/100 | +73 puntos |
| Contenido principal visible (LCP) | 58,2 s | 2,3 s | 25× más rápido |
| Bloqueo del hilo (TBT) | 2.940 ms | 10 ms | 294× menos |
| Peso de página | 13,9 MB | 347 KB | 41× más ligera |
Cómo se consiguió
- HTML estático pregenerado con Next.js — cada página se sirve lista, sin computación por visita
- Imágenes en WebP/AVIF con tamaños por dispositivo y carga diferida automática
- Tipografías autohospedadas sin bloquear el renderizado
- Cero JavaScript innecesario: galería y desplegables con HTML nativo
- Mismo contenido: textos, precios, fotos y reseñas idénticos al original
Metodología
Ambas versiones se midieron con Lighthouse (emulación móvil, mismas condiciones). Los informes completos están disponibles — pídemelos y te los envío.
La tienda original se mantiene anónima por respeto: este caso demuestra técnica, no señala a nadie.
¿Tu tienda tarda?
Si tu tienda o la de tus clientes carga lenta, este mismo proceso es aplicable: diagnóstico medible, mejora sin cambiar de plataforma y resultado verificable.
Hablemos