Por qué las páginas con texturas se ralentizan
Las texturas son contenido pesado en imágenes. Una galería con 50 vistas previas como PNG sin optimizar podría transferir 25–50 MB. El objetivo es mantener la carga inicial bajo 2 MB con previsualizaciones de alta calidad.
Selección de formato: WebP sobre PNG
WebP logra archivos 25–35% más pequeños que PNG a calidad equivalente.
Carga diferida e imágenes responsivas
El atributo loading=“lazy” difiere la carga hasta que las imágenes estén cerca del viewport. Usa srcset para servir imágenes del tamaño apropiado para cada dispositivo.
CDN y caché
Sirve imágenes desde CDN con cabeceras de caché agresivas. Usa Cache-Control: public, max-age=31536000, immutable para miniaturas estáticas.
Midiendo el rendimiento
Usa Lighthouse o WebPageTest para medir LCP y TBT. Monitorea Core Web Vitals en Google Search Console.