HYVÄ THEME MAGENTO: 3× SCHNELLER FÜR SCHWEIZER SHOPS

Das Hyvä-Theme löst dieses Problem grundlegend. Nicht mit einem Cache-Plugin. Nicht mit einem CDN-Workaround. Sondern mit einer komplett neuen Frontend-Architektur, die Magento von seinem grössten Schwachpunkt befreit. In diesem Artikel zeigen wir Ihnen, was Hyvä konkret verändert, welche Ergebnisse realistisch sind und was eine Umstellung für Schweizer KMU kostet.

Auf einen Blick

• Was ist Hyvä: Ein alternatives Frontend-Theme für Magento 2, das Luma komplett ersetzt und auf Alpine.js + Tailwind CSS setzt.
• Typische Verbesserung: PageSpeed-Score von 25 bis 40 (Luma) auf 85 bis 98 (Hyvä), messbar in Google Lighthouse.
• Technischer Kern: Statt 300+ JS/CSS-Dateien lädt Hyvä unter 10. Die Seitengrösse sinkt um 70 bis 80 Prozent.
• Kosten: CHF 12'000 bis CHF 35'000 für eine Migration, je nach Shop-Komplexität und Anzahl Drittmodule.
• Nicht für jeden: Shops mit vielen spezialisierten Luma-Extensions brauchen eine ehrliche Aufwandsanalyse, bevor die Entscheidung fällt.

Was ist das Hyvä-Theme und warum gibt es das überhaupt?

Magento 2 kam 2015 mit einem neuen Frontend namens Luma auf den Markt. Es basiert auf RequireJS, Knockout.js und einem eigenen UI-System. Für die damalige Zeit war das akzeptabel. Zehn Jahre später ist Luma das grösste Performance-Problem im gesamten Magento-Ökosystem.

Das liegt nicht an schlechtem Hosting oder fehlender Optimierung. Es liegt an der Architektur selbst. Luma lädt bei einem typischen Seitenaufruf über 300 JavaScript- und CSS-Dateien. Viele davon blockieren das Rendering. Das bedeutet: Der Browser muss hunderte Dateien herunterladen, parsen und ausführen, bevor der Kunde überhaupt etwas sieht.

Willem Wigman, ein niederländischer Magento-Entwickler, hat 2021 das Hyvä-Theme veröffentlicht. Seine Idee: Das komplette Luma-Frontend wegwerfen und durch eine moderne, schlanke Architektur ersetzen. Statt RequireJS und Knockout.js verwendet Hyvä zwei bewährte Technologien:

• Alpine.js (ca. 15 KB): Ein minimales JavaScript-Framework für interaktive Elemente wie Warenkorb, Filter oder Produktgalerie.
• Tailwind CSS: Ein Utility-First-CSS-Framework, das nur die tatsächlich genutzten Styles ausliefert.

Das Ergebnis: Statt 2 bis 4 MB JavaScript pro Seitenaufruf lädt ein Hyvä-Shop typischerweise unter 200 KB. Das ist keine Marketing-Zahl. Das messen wir in jedem Projekt mit Lighthouse.

Warum Luma so langsam ist: die technischen Ursachen

Um zu verstehen, was Hyvä besser macht, muss man verstehen, warum Luma versagt. Es sind drei Hauptprobleme:

1. RequireJS und die Modullast

RequireJS war 2013 der Standard für JavaScript-Modullading. Heute ist es veraltet. Es erzwingt dutzende HTTP-Requests, weil jedes Modul einzeln geladen wird. Selbst mit Bundling (das Magento optional anbietet) bleibt die Ladezeit problematisch, weil die Bundles zu gross und schlecht optimiert sind.

2. Knockout.js für alles

Luma verwendet Knockout.js für UI-Binding. Jedes Formular, jeder Checkout-Schritt, jede Produktoption wird über Knockout gerendert. Das Framework selbst ist nicht riesig. Aber die Art, wie Magento es einsetzt, erzeugt hunderte kleine Templates und Bindings, die der Browser bei jedem Seitenaufruf verarbeiten muss.

3. CSS-Overload durch LESS

Lumas Styling basiert auf LESS-Präprozessoren mit tiefen Vererbungsketten. Ein typisches Luma-Theme liefert 400 bis 600 KB CSS aus. Davon nutzt eine einzelne Seite vielleicht 15 Prozent. Der Rest ist toter Code, den der Browser trotzdem parsen muss.

Diese drei Faktoren zusammen erklären, warum selbst ein technisch sauber aufgesetzter Magento-Shop mit Luma selten über einen PageSpeed-Score von 50 kommt. In unserem Vergleich von Magento und Shopware haben wir dieses Frontend-Problem bereits als einen der grössten Unterschiede zwischen den Plattformen identifiziert.

Luma vs. Hyvä: die Zahlen im Vergleich

Theorie ist das eine. Hier sind konkrete Messwerte, die wir in Kundenprojekten erhoben haben. Alle Werte stammen aus Google Lighthouse (Mobile, Standardeinstellungen).

Die Zahlen sprechen deutlich. Aber es geht nicht nur um Lighthouse-Scores. Google verwendet Core Web Vitals (LCP, CLS, INP) als Rankingfaktor. Ein Shop mit einem LCP von 6 Sekunden wird gegenüber einem Wettbewerber mit 1,2 Sekunden benachteiligt. Bei gleicher SEO-Arbeit und gleichem Content.

Was das für Ihren Umsatz bedeutet

Schnellere Ladezeiten wirken sich direkt auf Conversion und Umsatz aus. Die Zahlen sind gut dokumentiert:

• Jede Sekunde zusätzliche Ladezeit reduziert die Conversion-Rate um 7 bis 12 Prozent (Quelle: Portent, 2022).
• 53 Prozent der mobilen Nutzer verlassen eine Seite, die länger als 3 Sekunden lädt (Quelle: Google, Think with Google).
• Shops mit Core Web Vitals im grünen Bereich verzeichnen im Schnitt 24 Prozent weniger Absprünge (Quelle: Google Chrome UX Report).

Für einen Schweizer Onlineshop mit CHF 500'000 Jahresumsatz bedeutet eine Verbesserung der Conversion-Rate um 10 Prozent: CHF 50'000 mehr Umsatz pro Jahr. Bei CHF 2 Millionen Umsatz sind es CHF 200'000. Die Investition in ein Hyvä-Theme amortisiert sich in den meisten Fällen innerhalb von 3 bis 6 Monaten.

Unsere Erfahrung mit Hyvä: Was wir in der Praxis sehen

In 17+ Projekten seit 2006 haben wir die Entwicklung von Magento in jeder Phase begleitet. Von Magento 1 über die holprige Migration auf Magento 2 bis hin zu Hyvä. Ein paar Beobachtungen aus der täglichen Arbeit:

Die Entwicklung wird schneller

Hyvä-Templates sind einfacher als Luma-Templates. Ein erfahrener Entwickler braucht für eine Anpassung an der Produktseite mit Hyvä typischerweise 30 bis 50 Prozent weniger Zeit als mit Luma. Das liegt am sauberen Markup, an der klaren Trennung und an der deutlich besseren Dokumentation.

Weniger Bugs, weniger Debugging

Luma-Bugs sind oft JavaScript-Konflikte zwischen Knockout-Bindings verschiedener Module. Diese Konflikte sind schwer zu diagnostizieren und teuer zu beheben. Mit Alpine.js und seiner simplen Architektur fallen diese Probleme fast komplett weg.

Bessere Wartbarkeit

Ein Hyvä-Theme besteht aus weniger Dateien, weniger Abhängigkeiten und weniger Abstraktionsebenen. Updates lassen sich schneller einspielen. Die versteckten Kosten eines Webshops, die wir in einem früheren Artikel analysiert haben, sinken mit Hyvä spürbar. Weniger technische Schulden bedeuten weniger böse Überraschungen bei der nächsten Magento-Version.

Checkout bleibt ein Thema

Der Magento-Standard-Checkout ist tief in Knockout.js verwurzelt. Hyvä bietet dafür den Hyvä Checkout (ehemals Magewire Checkout) als Alternative. Er funktioniert gut, erfordert aber eine eigene Konfiguration. Shops mit stark angepassten Checkout-Prozessen (mehrstufig, B2B-spezifisch, ERP-integriert) brauchen hier zusätzlichen Aufwand.

Was kostet eine Hyvä-Migration?

Transparenz bei Kosten gehört zu unserem Selbstverständnis. Hier sind realistische Zahlen für Schweizer KMU:

In diesen Kosten enthalten: die Hyvä-Lizenz (ca. EUR 1'000 pro Jahr), die Frontend-Neuentwicklung, die Anpassung oder der Ersatz nicht kompatibler Module, Testing und Deployment. Nicht enthalten: Backend-Anpassungen, neue Funktionalitäten oder ein Redesign. Diese Posten sind unabhängig vom Theme und fallen bei Bedarf separat an.

Was die Lizenz kostet

Hyvä ist kein Open-Source-Projekt. Die Lizenz kostet aktuell rund EUR 1'000 pro Jahr für einen einzelnen Shop. Multi-Store-Lizenzen und Agentur-Pakete gibt es zu gestaffelten Preisen. Im Vergleich zu den Entwicklungskosten eines Luma-Themes ist die Lizenzgebühr überschaubar.

Wann Hyvä Sinn macht und wann nicht

Wir empfehlen Hyvä nicht pauschal jedem Kunden. Das wäre unseriös. Hier ist unsere ehrliche Einschätzung:

Hyvä ist die richtige Wahl, wenn:

• Ihr Shop auf Luma basiert und PageSpeed-Scores unter 50 hat (Mobile).
• Sie ohnehin ein Redesign oder ein grösseres Update planen.
• Ihre Drittmodule mehrheitlich Hyvä-kompatibel sind (die meisten grossen Anbieter wie Amasty, Mirasvit und Aheadworks bieten Hyvä-Versionen an).
• Sie im B2C-Bereich tätig sind und mobile Performance direkt Ihren Umsatz beeinflusst.
• Sie langfristig planen und die laufenden Wartungskosten senken wollen.

Hyvä ist nicht die richtige Wahl, wenn:

• Ihr Shop stark auf Luma-spezifische Extensions angewiesen ist, für die es keine Hyvä-Variante gibt. Jede nicht kompatible Extension muss neu entwickelt werden. Das kann den Aufwand verdoppeln.
• Ihr Checkout extrem individuell ist und sich nicht ohne Weiteres auf Hyvä Checkout umstellen lässt.
• Ihr Budget unter CHF 12'000 liegt. Eine halbfertige Migration bringt mehr Probleme als Nutzen.
• Sie in 12 Monaten ohnehin einen Plattformwechsel planen. Dann investieren Sie besser direkt in die neue Lösung.

Wir sagen das klar, weil wir keine Agentur sind, die jedes Projekt annimmt. In unserem Leitfaden zur Agenturwahl beschreiben wir detailliert, worauf Schweizer Unternehmen bei der Auswahl achten sollten. Ehrliche Beratung gehört dazu.

So läuft eine Hyvä-Migration bei DevQon ab

Unser Vorgehen ist strukturiert und transparent. Jede Hyvä-Migration folgt diesen Schritten:

1. Analyse und Modulprüfung (1 bis 2 Tage)

Wir prüfen jeden installierten Drittanbieter auf Hyvä-Kompatibilität. Sie erhalten eine klare Liste: kompatibel, ersetzbar oder kritisch. Daraus ergibt sich der realistische Aufwand.

2. Design-Konzept (3 bis 5 Tage)

Hyvä bietet ein eigenes Default-Design, das als Basis dient. Wir passen es an Ihre CI an: Farben, Typografie, Layout, Navigation. Kein Pixel-perfektes Redesign nötig, aber ein sauberes, markenkonformes Erscheinungsbild.

3. Frontend-Entwicklung (2 bis 8 Wochen)

Das Kernstück. Templates werden in Hyvä neu gebaut, Alpine.js-Komponenten entwickelt, Tailwind-Konfiguration eingerichtet. Parallel dazu werden nicht kompatible Module angepasst oder durch Alternativen ersetzt.

4. Testing und QA (1 bis 2 Wochen)

Wir testen auf allen relevanten Geräten und Browsern. Checkout-Flows werden Schritt für Schritt durchgespielt. Performance wird mit Lighthouse und WebPageTest gemessen. Erst wenn alle Core Web Vitals im grünen Bereich sind, gehen wir live.

5. Go-Live und Monitoring (1 Tag plus laufend)

Der Go-Live erfolgt mit Zero-Downtime-Deployment. In den ersten zwei Wochen überwachen wir Performance und Conversion-Daten engmaschig. Sollte ein Problem auftreten, rollen wir innerhalb von Minuten auf den vorherigen Stand zurück.

Was Sie von uns bekommen

Nach Abschluss der Migration erhalten Sie eine dokumentierte Vorher-Nachher-Messung aller Core Web Vitals. Keine vagen Versprechen, sondern Zahlen aus Lighthouse, die Sie jederzeit selbst nachprüfen können. Dazu eine Liste aller angepassten Module und eine Einweisung in die Tailwind-basierte Template-Struktur, damit Ihr Team kleinere Anpassungen künftig selbst vornehmen kann.

Hyvä und Adobe Commerce: wie passt das zusammen?

Eine häufige Frage: Funktioniert Hyvä auch mit Adobe Commerce (der kommerziellen Variante von Magento)? Ja. Hyvä ist mit beiden Editionen kompatibel: Magento Open Source und Adobe Commerce. Die Page-Builder-Integration von Adobe Commerce wird über ein separates Hyvä-Modul abgedeckt.

Allerdings sollten Adobe-Commerce-Kunden beachten, dass einige Commerce-spezifische Features (wie der B2B-Module-Stack oder die Staging-Funktionalität) zusätzliche Anpassungen im Hyvä-Frontend erfordern. Der Aufwand dafür ist projektabhängig und sollte in der Analysephase ehrlich beziffert werden.

Häufig übersehene Vorteile von Hyvä

Neben der offensichtlichen Performance-Verbesserung gibt es Vorteile, die erst im laufenden Betrieb sichtbar werden:

Bessere Entwickler-Verfügbarkeit

Knockout.js und RequireJS sind Technologien, die kaum noch ein Frontend-Entwickler freiwillig lernt. Alpine.js und Tailwind CSS hingegen gehören zu den beliebtesten Tools der Webentwicklung. Das bedeutet: Sie finden leichter Entwickler und die Einarbeitungszeit sinkt.

Zukunftssicherheit

Adobe hat angekündigt, das Luma-Frontend mittelfristig durch eine neue Architektur zu ersetzen. Hyvä ist unabhängig von diesem Prozess und wird aktiv weiterentwickelt. Die Community wächst stetig. Stand 2026 nutzen über 3'000 Shops weltweit Hyvä.

Geringerer Hosting-Bedarf

Ein Hyvä-Shop belastet den Server weniger. Die geringere JavaScript-Last reduziert die CPU-Auslastung beim Rendern. In einigen Fällen konnten unsere Kunden nach der Migration auf einen günstigeren Hosting-Tarif wechseln. CHF 50 bis CHF 150 weniger pro Monat summieren sich über die Jahre.

Der Elefant im Raum: Kompatibilität mit Drittmodulen

Das grösste Risiko bei einer Hyvä-Migration sind inkompatible Extensions. Luma-Module, die eigene Frontend-Templates mitbringen, funktionieren mit Hyvä nicht automatisch. Sie müssen angepasst oder ersetzt werden.

Die gute Nachricht: Die Hyvä-Community hat in den letzten Jahren stark aufgeholt. Es gibt eine offizielle Kompatibilitätsliste mit über 600 Modulen. Die meisten grossen Anbieter (Amasty, Mirasvit, Mageworx, Aheadworks) liefern Hyvä-kompatible Versionen mit.

Die schlechte Nachricht: Nischen-Module, Eigenentwicklungen und ältere Extensions ohne aktiven Support müssen oft komplett neu gebaut werden. Das kann pro Modul zwischen CHF 2'000 und CHF 8'000 kosten.

Deshalb beginnt jedes Hyvä-Projekt bei uns mit einer vollständigen Modulanalyse. Keine Überraschungen nach Projektstart.

Hyvä für B2B-Shops: besondere Überlegungen

B2B-Shops haben andere Anforderungen als B2C. Kundenspezifische Preise, Staffelrabatte, Anfrage-statt-Kauf-Flows, komplexe Berechtigungsstrukturen. Hyvä deckt die Standard-B2B-Funktionen ab. Für tiefgreifende B2B-Logik ist aber zusätzliche Entwicklung nötig.

Unsere Empfehlung: Prüfen Sie zuerst, ob Ihre B2B-Anforderungen tatsächlich Frontend-relevant sind. Viele B2B-Features (ERP-Sync, Preisberechnung, Berechtigungen) laufen im Backend. Das Frontend muss die Ergebnisse nur darstellen. In diesen Fällen ist Hyvä problemlos einsetzbar.

Für Unternehmen, die einen neuen B2B-Shop planen, ist es oft sinnvoller, direkt mit Hyvä zu starten statt erst Luma aufzubauen und dann zu migrieren. Die Gesamtkosten sind niedriger und die Time-to-Market kürzer. Gleichzeitig profitieren Ihre Einkäufer und Vertriebspartner vom ersten Tag an von schnellen Ladezeiten, was gerade bei grossen Katalogen mit tausenden Produkten spürbar ist.

Fazit und nächster Schritt

Zusammengefasst: Das Hyvä-Theme ersetzt die grösste Schwachstelle von Magento 2. Es macht Ihren Shop 3 bis 5 Mal schneller, reduziert JavaScript um über 90 Prozent und verbessert alle Core Web Vitals messbar. Die Investition liegt für Schweizer KMU zwischen CHF 12'000 und CHF 45'000 und amortisiert sich in den meisten Fällen innerhalb weniger Monate. Aber: Nicht jeder Shop profitiert gleichermassen. Eine ehrliche Analyse Ihrer Module und Anforderungen steht immer am Anfang.

Auf unserer Leistungsseite zu Hyvä und Magento finden Sie weitere Details zu unserem Vorgehen, Referenzprojekte und konkrete Beispiele aus der Praxis.

Oder buchen Sie direkt ein 30-minütiges Erstgespräch — kostenlos, unverbindlich. Termin wählen.