Onlineshop-Betreuung

Die Parma Sassone GbR verkauft in ihrem Onlineshop Hen&Stag zahlreiche Top-Artikel für Junggesellenabschiede & Trauzeuginnen / Trauzeugen. Spezialisiert auf Junggesellenabschieds-Outfits und Accessoires bietet Hen&Stag seinen Kunden alles, was sie für diesen wichtigen Lebensabschnitt benötigen.

Projektbeschreibung

Das Ziel des Projekts ist die Betreuung des Magento 2 Onlineshops für fortlaufende Optimierung & Updates. Dabei liegt der Fokus vorerst auf einer fehlerfreien Entwicklung des gesamten Shop-Konstrukts.

Durch die Übernahme der Entwicklungs-Administration soll für nachhaltige Sicherheit im System gesorgt werden, der wir durch unseren Support den Rücken stärken.

Auch das Major Update von Magento CE 2.2 auf 2.4 brachte einige technische Hürden mit sich, die die Parma Sassone GbR in unsere Obhut gab.

Darüber hinaus wurden im Laufe der Zeit einige Optimierungen gewünscht:

• Integration von WEBP für eine schnellere Ladezeit

• Einrichtung von Advanced JS Bundling

Umsetzung

Zunächst wurde eine neue Entwicklungsumgebung (Dev/Work) eingerichtet, der zugehörige Server konfiguriert & getestet. Von dort werden sämtliche Anpassungen vorgenommen und über den Deploymentprozess live gestellt.

Da bisher kein vollautomatisch funktionierender Deploymentprozess existierte, kümmerten wir uns um die fehlerfreie Einrichtung dessen.

Darüber hinaus folgten einige Feinanpassungen:

• Entfernen von überflüssigen Modulen
• Usability-Optimierungen konzipiert und umgesetzt
• Funktionale Bugs gefixt

Das Update von Magento 2.2 auf 2.4

Zunächst wurden neue Entwicklungs-, Staging- oder Live-Server der Firma Krankikom gesichert und eingerichtet. Dabei mussten Datenbanken aktualisiert und Apache auf HTTP/2 umgestellt werden.

Nachdem die neue Version auf dem neu eingerichteten Entwicklungsserver installiert wurde, führten wir alle Modul und Plugin Updates durch. Auch das Theme wurde aktualisiert. Zum Schluss musste noch die .htaccess geupdatet werden, wobei insbesondere Image Redirects und Cache Lifetime relevant waren. Für die Suche mussten wir  aufgrund eines Fehlers MySQL durch ElasticSearch austauschen.

In Folge einiger Bugfixes konnten wir das Deployment durchführen. Als beim Testing keine Fehler mehr auftraten, erfolgte der Livegang.

Integration von WEBP für eine schnellere Ladezeit

Vorerst wurden alle Bilder manuell in .webp konvertiert (inkl. aller relevanten Resizes) und auf den LIVE-Server geschoben. Die Templates wurden nun so umgestellt, dass in allen Listings (Kategorieseiten, Slider etc.) das <picture>-Element verwendet wird. Die Bilder im .jpg-Format bleiben als Fallback integriert (daher das Picture-Element) für Browser, die .webp nicht unterstützen.

Einrichtung von Advanced JS Bundling

Um die Anzahl und Größe der Serveranfragen zu reduzieren und so eine bessere Performance zu erreichen, wurde Advanced JS Bundling installiert. Nach Konfigurationen im Backend mussten folgende Anpassungen gemacht werden:

1. Nachdem der static Content generiert wurde, mussten wir diesen in ein tmp Verzeichnis legen.
2. Dann wurde mit r.js der Content optimiert und wieder in das richtige Verzeichnis zurückgeschrieben.
3. Dann musste die build.js angepasst werden.
4. Dann wurde nochmal der Befehl mit r.js ausgeführt.

Nach ein paar Fehlerbehebungen im Bereich CSS und Minicart konnten wir das Bundling für den Liveserver einrichten.