Zo zorgt het Hyvä-thema voor een snellere Magento 2-webshop

Magento 2 is voor veel grote webshops hét ideale e-commerceplatform. Het biedt enorm veel mogelijkheden, is geschikt zowel voor B2B als B2C en is schaalbaar voor groeiende webshops. Maar Magento 2 is ook complex, kan af en toe log aanvoelen en vereist behoorlijk specialistische kennis. Het Nederlandse Hyvä wil daar met hun nieuwe standaardthema voor Magento 2 verandering in brengen. Wij werken inmiddels met Hyvä. Met resultaat!

Wat is Hyvä?

Een Magento 2-webshop begint met een basisthema. Standaard komt Magento 2 met twee basisthema’s waarmee je in principe een functionele webshop zou kunnen bouwen: Blank en Luma. Om daar ook je eigen sausje (en functionaliteiten) overheen te kunnen gieten, installeren webshopeigenaren meestal een custom thema. Je gebruikt daarbij dus nog steeds de basisthema’s van Magento 2 zelf.

En hoewel Magento 2 één van de meest gebruikte open source frameworks voor grote webshops is, kleven daar ook wat keerzijdes aan vast. Webshopeigenaren herkennen vast de relatief hoge doorontwikkelkosten en de complexe techniek, die voor tragere laadtijden van de webshop kan zorgen. Daar viel tot voor kort weinig aan te doen, want je moest immers een basisthema van Magento zelf geïnstalleerd hebben.

Hyvä is een alternatief basisthema voor Magento 2-webshops dat met die nadelen wil afrekenen. Een groot deel van de zware Magento 2-techniek ligt namelijk verankerd in het basisthema Luma. Hyvä wil met hun alternatieve thema voor een snellere, minder complexe basis zorgen. Of zoals Hyvä het zelf zegt:

Hoe zorgt Hyvä voor een snellere Magento 2-webshop?

Het basisthema Luma gebruikt dus zware, complexe technieken. In het specifiek – voor de technici onder ons – gaat het bijvoorbeeld om JavaScript-bibliotheken als KnockoutJS, RequireJS en jQuery. Die zijn nodig om de ‘voorkant’ van de webshop voor de gebruiker te laten werken. Hyvä vervangt die bibliotheken door AlpineJS. Dat levert direct merkbare voordelen op:

• Magento 2 laadt veel minder JavaScript-code in, wat voor snellere laadtijden en paginasnelheid zorgt;
• JavaScript wordt alleen binnen de templates geplaatst, waardoor het niet onnodig ingeladen wordt;
• AlpineJS is een relatief licht JavaScript-framework en is snel te leren, waardoor ontwikkelen met Hyvä minder complex is dan met het standaardthema Luma.

Hyvä belooft dus eenvoudiger, sneller en toegankelijker te zijn dan het basisthema Luma. Makkelijker om mee te ontwikkelen, minder afhankelijkheden van andere JavaScript-software. Bovendien ziet Hyvä zichzelf vanwege de gebruiksvriendelijkheid als een goed alternatief voor headless Progressive Web Apps.

Hyvä in de praktijk: de resultaten

Want het klinkt allemaal enorm interessant, zo’n nieuw standaardthema, maar presteert het ook beter?

Het simpele, misschien enigszins voorbarige antwoord is: ja.

Wij gingen voor MS Broedmachines en Xambeau aan de slag met Hyvä als standaardthema. En inderdaad: Hyvä maakte het onze ontwikkelaars een stuk makkelijker. De ontwikkeling kostte daarom minder tijd dan een Magento 2-webshop gebaseerd op Luma.

Maar belangrijker nog: de verschillen in laadsnelheid, en dus: prestaties.

De site van MS Broedmachines scoort (uit een maximale score van 100 punten) 90 punten op mobiel en 100 punten op desktop. En dat merk je, als je wat rondklikt op de site.

Ook de site van Xambeau presteert fantastisch met een score van 91 (mobiel) en 100 (desktop). En ook hier laden pagina’s onmiddellijk en compleet in.

Om dat even in perspectief te plaatsen: de homepage van Google scoort zelf 94 op mobiel – ietsje sneller dus dan de volledige webshops hierboven, die op het toch al iets tragere Magento draaien. Bol.com en Coolblue scoren respectievelijk 66 en 51 punten.