Sichtbarkeit des Online Shops. Was tun wir dafür?

Je niedriger die Leistung, desto größer das Risiko, dass die Seite weniger Traffic erhält und die Sichtbarkeit im Google-Ranking sinkt.

Wenn die Leistung einer Website beim Google PageSpeed-Score nur 50 Punkte erreicht, bedeutet das, dass sie im Vergleich zu optimierten Seiten langsamer ist. Dies kann tatsächlich zu einer sinkenden Sichtbarkeit in den Suchergebnissen führen, da Google Geschwindigkeit als einen Ranking-Faktor betrachtet, vor allem bei der mobilen Suche.

In den 7 Jahren, in denen wir mit Magento arbeiten, hatten wir die Gelegenheit, an der Erstellung und Verbesserung von mehreren Dutzend Shops mitzuwirken. Dabei sind die Aufgaben immer ungefähr dieselben: Pagespeed Optimierung, Verbesserung der Leistung, Optimierung des Codes und Reduzierung von Abhängigkeiten.

Mögliche Verbesserungen

Fast jedes Projekt beginnen wir mit einem Basistemplate, und in den meisten Fällen ist das Luma - die Standardvariante für Magento 2. Allerdings sind Projekte, die auf diesem Template basieren, oft ziemlich langsam. Dies liegt sowohl an umfangreichen architektonischen Entscheidungen als auch an einem Überfluss an Skripten und Stilen.

Dadurch dauert das Laden der Seite länger, als der Nutzer erwartet, und Entwickler müssen mit einer Vielzahl unterschiedlicher Bibliotheken (Knockout, jQuery, RequireJS, UI Components) arbeiten, was die Entwicklung komplizierter und das Projekt weniger flexibel macht.

Was fehlt den Standardthemen Magento Luma/Blank, um den heutigen Anforderungen der Entwickler und Nutzer gerecht zu werden?

Zunächst einmal natürlich die schwache Leistung. Jeder, der mit der Magento-Entwicklung zu tun hatte, weiß, wie viel Zeit für das Warten auf die Neukompilierung von Code und Templates draufgeht. Und danach muss der gesamte Code dem Nutzer bereitgestellt werden, in der Hoffnung, dass der Besucher das Laden und Verarbeiten aller Stile und Skripte abwartet, bevor er die Shop-Seite verlässt.

Zweitens die Verwendung alter Technologien. Nein, knockoutJS ist zweifellos eine großartige Bibliothek, aber der letzte Browser, der modernen JavaScript nicht unterstützte, hat vor über einem Jahr die offizielle Unterstützung eingestellt.

Die neue Lösung Hyvä

Um mit Hyvä als Entwickler zu arbeiten, braucht man sicherlich einige Zeit. In dieser Zeit kann man die offizielle Dokumentation durchgehen, lernen, wie Alpine.js funktioniert, die Struktur des Templates verstehen und lernen, wie man es zusammenstellt. Es ist auch nützlich, sich mit Tailwind CSS vertraut zu machen, da es für die Erstellung der Stile in diesem Thema verwendet wird. Technisch gesehen gibt es nichts, was einen daran hindert, weiterhin reines CSS oder einen der Präprozessoren zu verwenden, aber mit diesem CSS-Framework kann man den Entwicklungsstil beibehalten, den die Autoren der Bibliothek "without ever leaving your HTML" (ohne das HTML jemals zu verlassen) nennen. Es enthält bereits Tausende von Klassen "out of the box" und bietet einfache Möglichkeiten, eigene Klassen hinzuzufügen, Breakpoints zu verarbeiten und mit Farbpaletten und Animationen zu arbeiten. Es ist auch nützlich, sich daran zu erinnern (oder zu lernen), wie man mit GraphQL arbeitet. Dieser Technologiestack reicht für einen Magento-Front-End-Entwickler, der das Hyvä-Thema verwendet.

Technisch gesehen enthält Hyvä zwei Themen: Hyvä/Reset und Hyvä/Default
Ähnlich wie Magento/Blank und Magento/Luma. Aber im Gegensatz zu Magento/Blank ermöglicht das Thema Hyvä/Reset, die Entwicklung der Seite "von Grund auf" zu beginnen. Danach kann der Entwickler die benötigten Blöcke selbst hinzufügen.

Nachteile

Kompatibilitätsprobleme mit Drittanbieter-Modulen: Hyvä ist nicht vollständig mit vielen Drittanbieter-Modulen kompatibel, die auf Knockout, jQuery oder anderen alten Technologien basieren. Diese Module müssen umgeschrieben werden, um mit Alpine.js und anderen modernen Bibliotheken zu arbeiten.
Eingeschränkte Unterstützung für Commerce/B2B-Module: Obwohl Hyvä die Basisfunktionalitäten von Magento abdeckt, sind einige spezialisierte Commerce- und B2B-Module noch nicht vollständig angepasst. Dies kann zu zusätzlichen Entwicklungsarbeiten führen, um die volle Funktionalität zu gewährleisten.
Lernkurve für neue Technologien: Entwickler müssen sich mit neuen Technologien wie Tailwind CSS und Alpine.js vertraut machen. Dies erfordert eine Lernkurve, insbesondere für diejenigen, die an die alten Magento-Technologien gewöhnt sind.
Initiale Entwicklungszeit: Die anfängliche Einrichtung und Anpassung von Hyvä kann mehr Zeit in Anspruch nehmen, insbesondere wenn bestehende Module und Funktionen migriert werden müssen.
Community und Support: Obwohl die Hyvä-Community wächst, ist sie noch nicht so groß und etabliert wie die der älteren Magento-Templates. Dies kann zu weniger verfügbaren Ressourcen und Support führen, insbesondere bei spezifischen Problemen.

Hier bringen wir unsere Erfahrung ins Spiel: