Alles, was Sie wissen sollten bevor Sie installieren.
Ein detaillierter Blick darauf, wie DataFirefly Image Optimizer — WebP, AVIF, Kompression und CDN für Shopware 6 funktioniert, warum wir es so gebaut haben und der Gedanke hinter den Funktionen oben.
Das Bild-Problem bei Standard-Shopware 6
Shopware komprimiert JPEGs via den nativen ThumbnailService und generiert mehrere Thumbnail-Größen, produziert aber weder WebP noch AVIF. Doch WebP spart im Durchschnitt 25 bis 35 Prozent gegenüber JPEG, und AVIF geht noch tiefer — zwischen 50 und 60 Prozent Gewinn über JPEG in den meisten Fällen. Ohne diese Formate bleibt Ihr Largest Contentful Paint schwer, und Ihre Core Web Vitals stagnieren. Ohne native CDN-Integration wird zudem jedes Bild vom Anwendungsserver ausgeliefert, was Last und Latenz für entfernte Besucher erhöht.
Die vollständige Pipeline, die dieses Plugin installiert
Beim Medien-Upload hört der Subscriber auf media.written und erkennt JPEG-, PNG- und GIF-Typen. In-Place-Neukompression des Originals wird angewendet, wenn aktiviert — progressives JPEG mit Subsampling 2x2/1x1/1x1 und konfigurierbarer Qualität, PNG mit getuntem Kompressionslevel und Filtern. EXIF- und ICC-Metadaten werden entfernt, wenn die Option markiert ist — nicht zu vernachlässigender Gewichtsgewinn bei Fotos direkt aus der Kamera. Dann wird das WebP-Geschwister daneben mit einer kumulativen Erweiterung generiert — foo.jpg.webp — in der konfigurierten Qualität, optionaler Lossless-Modus für PNGs. Dann wird das AVIF-Geschwister mit eigener, unabhängiger Qualität und einem Max-Breite-Schutz generiert, um CPU-Sättigung auf sehr großen Bildern zu vermeiden. Schließlich erhalten Shopware-Thumbnails dieselbe Behandlung.
CDN-Rewriting mit fein abgestuftem Geltungsbereich
Die CDN-Integration schreibt nicht einfach blind alle URLs um. Drei Geltungsbereiche sind verfügbar: nur Medien, das nur URLs berührt, die mit /media beginnen; Medien plus Thumbnails, das /thumbnail hinzufügt; und alle statischen Assets, das auch /theme, /bundles und /assets einschließt. Der Standard-Geltungsbereich, nur Medien, ist der sicherste und deckt 95 Prozent der Anwendungsfälle ab. Der df_cdn-Twig-Filter erlaubt zudem Theme-Entwicklern, das Rewriting manuell auf jede URL anzuwenden. Wenn das CDN aktiv ist, injiziert das Plugin automatisch dns-prefetch und preconnect im Head, was je nach Latenz 50 bis 200 ms auf der ersten CDN-Anfrage spart.
Picture-Rendering nach Best Practices
Die Komponente storefront/component/image/thumbnail.html.twig wird via sw_extends erweitert. Der Block component_thumbnail_picture wrappt den parent img-Tag in einem Picture mit AVIF- dann WebP-Quellen, gefolgt vom Original-Fallback. Die Reihenfolge ist wichtig — AVIF zuerst, weil moderne Browser es bevorzugen und damit am meisten Bandbreite sparen, WebP zweitens als Sicherheitsnetz für älteres Safari, und der JPEG/PNG-Fallback für alles andere. Die Attribute loading lazy, decoding async, width und height zur CLS-Vermeidung werden konfigurationsabhängig hinzugefügt.
Scheduled Task für bereits gespeicherte Bilder
Die Aktivierung des Plugins in einem Shop mit bereits Tausenden von Bildern in der Bibliothek löst die retroaktive Optimierung nicht automatisch aus — das wäre gefährlich. Stattdessen läuft ein Shopware Scheduled Task standardmäßig alle 15 Minuten, identifiziert noch nicht optimierte Medien via einen LEFT JOIN auf df_image_optimizer und verarbeitet einen konfigurierbaren Batch — 50 standardmäßig. Dies ermöglicht es einem großen Shop, in wenigen Stunden aufzuholen, ohne die Queue zu blockieren oder den Server zu überlasten. Ein Button im Admin-Dashboard erlaubt zudem, jederzeit einen manuellen Batch auszulösen.
Transparente Servererkennung
Vor der allerersten Optimierung zeigt das Dashboard in Echtzeit, was serverseitig verfügbar ist: PHP-Version, Imagick-Vorhandensein mit seinen unterstützten Formaten, GD-Vorhandensein mit seinen Formaten, effektiver WebP- und AVIF-Support, empfohlene Engine. Imagick wird priorisiert, wenn verfügbar, weil es bessere Encoding-Qualität und nativen AVIF-Support via libheif bietet. GD übernimmt sonst — es unterstützt WebP seit Langem und AVIF seit PHP 8.1. Keine Überraschungen — wenn AVIF serverseitig nicht verfügbar ist, überspringt das Plugin diesen Schritt einfach und macht mit WebP weiter.
Sicherheit und Sauberkeit
Konvertierungen sind atomar — das Plugin staged das Bild in eine lokale Temp-Datei für Konverter, die einen echten Pfad brauchen, und räumt dann systematisch via einen finally-Block auf. Fehler werden via PSR Logger geloggt, ohne jemals die Schreibtransaktion des Mediums zu unterbrechen. Die Deinstallation bietet an, Benutzerdaten zu erhalten oder nicht — die df_image_optimizer-Tabellen werden nur entfernt, wenn Sie die Option deaktivieren. Die generierten WebP- und AVIF-Dateien im Filesystem bleiben standardmäßig erhalten.
Für wen ist dieses Plugin?
Für jeden Shopware 6 Shop, in dem Bilder ein Engpass bei LCP oder Bandbreite sind. Für B2C-Shops mit reichen Foto-Katalogen — Mode, Deko, Möbel, Lebensmittel. Für internationale Shops, die weit vom Origin-Server entfernt ausliefern und auf ein CDN entlasten wollen. Für Theme-Entwickler, die einen sauberen Twig-Filter und eine Funktion wollen, anstatt img-Tags von Hand zu patchen. Für SEO-Teams, die Core Web Vitals verfolgen und leicht 20 bis 40 PageSpeed-Punkte gewinnen wollen.
Es gibt noch keine Rezensionen.