Shopware Extensiones Shopware

DataFirefly Image Optimizer — WebP, AVIF, compresión y CDN para Shopware 6

Image optimizer Shopware 6: WebP, AVIF, compresión y CDN, activados automáticamente al subir

Sirva sus imágenes en el formato más moderno que cada navegador soporta, recomprima el original, y descargue la entrega a su CDN — sin tocar el código de su tema.

Shopware 6.6 Shopware 6.7 WebP + AVIF CDN compatible Anti-CLS Imagick + GD
  • Reembolso de 30 días
  • 12 meses de actualizaciones
  • Soporte 24h
www.datafirefly.com/es/
DataFirefly Image Optimizer — WebP, AVIF, compresión y CDN para Shopware 6
v1.0.0 · actualizado 2026-05-23
Qué hace

La versión corta.

01

WebP y AVIF automáticos

Generación en paralelo para cada imagen origen. Calidades independientes configurables. Modo lossless WebP para PNG.

02

Recompresión JPEG y PNG

JPEG progresivos con submuestreo optimizado, PNG con nivel de compresión y filtros ajustados. Eliminación EXIF e ICC opcional.

03

Reescritura CDN transparente

Tres alcances de reescritura, compatible con BunnyCDN, KeyCDN, Cloudflare, CloudFront. DNS-prefetch y preconnect inyectados automáticamente.

04

Etiqueta picture nativa

Override del componente thumbnail Twig con fuentes AVIF, WebP y fallback original. Loading lazy, decoding async, anti-CLS width y height.

05

Panel en tiempo real

Detección servidor Imagick y GD, estadísticas globales, actividad 30 días, botón lanzamiento manual de lote.

06

Pipeline activado en 2 puntos

Suscriptor media.written para auto-optimización al subir, tarea programada para recuperar imágenes existentes en segundo plano.

La versión larga

Todo lo que querrías saber antes de instalar.

Una mirada detallada a cómo funciona DataFirefly Image Optimizer — WebP, AVIF, compresión y CDN para Shopware 6, por qué lo construimos así y la lógica detrás de las características anteriores.

§ 01

El problema de las imágenes en Shopware 6 por defecto

Shopware comprime los JPEG vía el ThumbnailService nativo y genera varios tamaños de miniaturas, pero no produce ni WebP ni AVIF. Ahora bien, WebP ahorra de media entre 25 y 35 por ciento respecto al JPEG, y AVIF baja aún más — entre 50 y 60 por ciento de ganancia sobre el JPEG en la mayoría de casos. Sin estos formatos su Largest Contentful Paint sigue pesado y su puntuación Core Web Vitals se estanca. Sin integración CDN nativa tampoco, cada imagen se sirve desde su servidor de aplicación, aumentando carga y latencia para visitantes distantes.

§ 02

El pipeline completo que instala este plugin

En la subida de un medio, el suscriptor escucha media.written y detecta tipos JPEG, PNG y GIF. La recompresión in-place del original se aplica si está activada — JPEG progresivo con submuestreo 2x2/1x1/1x1 y calidad configurable, PNG con nivel de compresión y filtros ajustados. Los metadatos EXIF e ICC se eliminan si la opción está marcada — ganancia de peso no despreciable en fotos directamente de cámara. Luego el hermano WebP se genera al lado con una extensión acumulada — foo.jpg.webp — a la calidad configurada, modo lossless opcional para PNG. Luego el hermano AVIF se genera con su propia calidad, independiente, y una salvaguarda de anchura máxima para evitar saturar la CPU en imágenes muy grandes. Finalmente las miniaturas Shopware reciben el mismo tratamiento.

§ 03

Reescritura CDN con alcance fino

La integración CDN no se contenta con reescribir ciegamente todas las URLs. Tres alcances disponibles: solo medios, que toca solo las URLs comenzando por /media, medios más miniaturas, que añade /thumbnail, y todos los recursos estáticos, que también incluye /theme, /bundles y /assets. El alcance por defecto, solo medios, es el más seguro y cubre el 95 por ciento de los casos de uso. El filtro Twig df_cdn permite además a los desarrolladores de temas aplicar la reescritura manualmente en cualquier URL. Cuando el CDN está activo, el plugin inyecta automáticamente dns-prefetch y preconnect en el head, ahorrando 50 a 200 ms en la primera petición CDN según la latencia.

§ 04

Renderizado picture alineado con mejores prácticas

El componente storefront/component/image/thumbnail.html.twig se extiende vía sw_extends. El bloque component_thumbnail_picture envuelve la etiqueta img padre en un picture con fuentes AVIF y luego WebP, seguidas del fallback original. El orden importa — AVIF primero porque los navegadores modernos lo prefieren y ahorran así más ancho de banda, WebP segundo como red de seguridad para Safari antiguo, y el fallback JPEG/PNG para todo lo demás. Los atributos loading lazy, decoding async, width y height para prevenir CLS se añaden según la configuración.

§ 05

Tarea programada para imágenes ya almacenadas

Activar el plugin en una tienda con ya miles de imágenes en biblioteca no dispara la optimización retroactiva automáticamente — sería peligroso. En su lugar, una tarea programada Shopware se ejecuta cada 15 minutos por defecto, identifica medios no optimizados todavía vía un LEFT JOIN sobre df_image_optimizer, y procesa un lote configurable — 50 por defecto. Esto permite a una tienda grande ponerse al día en pocas horas sin bloquear la cola ni saturar el servidor. Un botón en el panel admin permite también lanzar un lote manual en cualquier momento.

§ 06

Detección servidor transparente

Antes incluso de la primera optimización, el panel muestra en tiempo real lo disponible lado servidor: versión PHP, presencia Imagick con formatos soportados, presencia GD con formatos, soporte efectivo WebP y AVIF, motor recomendado. Imagick es priorizado cuando está disponible porque ofrece mejor calidad de codificación y soporte AVIF nativo vía libheif. GD toma el relevo si no — soporta WebP desde hace tiempo y AVIF desde PHP 8.1. Sin sorpresas — si AVIF no está disponible lado servidor, el plugin simplemente salta esa etapa y continúa con WebP.

§ 07

Seguridad y limpieza

Las conversiones son atómicas — el plugin stage la imagen en un fichero temporal local para los conversores que necesitan una ruta real, luego limpia sistemáticamente vía un bloque finally. Los errores se registran vía PSR Logger sin interrumpir nunca la transacción de escritura del medio. La desinstalación propone preservar o no los datos de usuario — las tablas df_image_optimizer se eliminan solo si desmarca la opción. Los archivos WebP y AVIF generados en el filesystem se conservan por defecto.

§ 08

¿Para quién es este plugin?

Para cualquier tienda Shopware 6 donde las imágenes representen un cuello de botella en LCP o ancho de banda. Para tiendas B2C con catálogos foto ricos — moda, decoración, mobiliario, alimentación. Para tiendas internacionales que entregan lejos del servidor de origen y quieren descargar en un CDN. Para desarrolladores de temas que quieren un filtro y función Twig limpios. Para equipos SEO que siguen Core Web Vitals y quieren ganar fácilmente 20 a 40 puntos de PageSpeed.