Magento 2 optimaliseren

Nu steeds meer ontwikkelpartijen zich actief bezig houden met de ontwikkeling van Magento 2 shops krijgen we steeds vaker vragen omtrent de snelheid van deze shops. In dit artikel geven wij jou een aantal handig tips om je webshop sneller te maken. Maak je gebruik van Magento 1? Dan verwijzen wij je graag door naar ons artikel Magento 1 optimaliseren.

Eén van de meest gehoorde opmerkingen: “Magento 2 zou toch sneller moeten zijn dan Magento 1?”
In de basis is deze opmerking zeker waar, de core code van Magento 2 is een stuk efficiënter geschreven. Wel is het zo dat het ontwikkel en deploy proces sterk veranderd is en als hierin zaken niet of onjuist worden uitgevoerd kan dit veel invloed hebben op de snelheid van de shop.

Magento 2 optimaliseren van een optimale performance

Eenmaal klaar met ontwikkeling is het tijd om alles klaar te zetten voor productie. Dit houdt o.a. in dat de statische content uitgerold moet worden, de code gecompileerd wordt en dat de Magento modus goed gezet moet worden; al deze stappen maken dat de shop optimaal en dus snel functioneert. Om het je zo gemakkelijk mogelijk te maken hebben we een workflow ontwikkeld die je kunt volgen. Zodoende weet je zeker dat je geen cruciale instellingen overslaat of onjuist instelt.

Stap 1. Workflow development naar productie

Activeren van cliënt-side performance features, deze verbeterd bezoekerservaring (snelheid)

a. Javascript bestanden samenvoegen
Ga in de backend naar Stores > Configuratie > Geavanceerd > Ontwikkelaar
Zet JavaScript-bestanden samenvoegen op Ja en klik op Config opslaan

b. Javascript bestanden bundelen
Ga in de backend naar Stores > Configuratie > Geavanceerd > Ontwikkelaar
Zet JavaScript Bundling inschakelen  op Ja en klik op Config opslaan.

c. Javascript bestanden verkleinen
Ga in de backend naar Stores > Configuratie > Geavanceerd > Ontwikkelaar
Zet JavaScript-bestanden verkleinen op Ja en klik op Config opslaan.

d. CSS bestanden samenvoegen
Ga in de backend naar Stores > Configuratie > Geavanceerd > Ontwikkelaar
Zet CSS-bestanden samenvoegen op Ja en klik op Config opslaan.

e. CSS bestanden verkleinen
Ga in de backend naar Stores → Configuratie → Geavanceerd → Ontwikkelaar
Zet CSS-bestanden verkleinen op Ja en klik op Config opslaan

Stap 2. Statische content

Met Magento 2 worden alle resources die gebruikt worden om je website te tonen geladen vanuit de pub/static folder, denk hierbij aan je template, vertalingen, CSS (stylesheet) en JS (javascript) bestanden. Om deze resources klaar te zetten voor productie moet het volgende commando via SSH. (Nog niet verbonden met SSH? Doe dat dan eerst. Het verbinden met SSH kan op drie manieren. Voor alle drie de manieren hebben wij een handleiding geschreven: SSH verbinden met Windows, SSH verbinden met Mac OS X of SSH verbinden met Linux.) op de server van jouw domeinnaam uitgevoerd worden in de public_html:

php bin/magento setup:static-content:deploy

Dit commando kan enkele minuten duren afhankelijk van de grootte van en hoeveelheid templates, hoeveelheid vertalingen etc. Mocht je meerdere talen ingesteld hebben dan zal je dit commando meerdere keren moeten uitvoeren. Standaard word alleen de en_US vertaling uitgerold. Door de vertaling achter het eerder gegeven commando te plaatsen word deze ook uitgerold. B.v. de Nederlandse vertaling:

php bin/magento setup:static-content:deploy nl_NL

Stap 3. Code compileren

Om te voorkomen dat de code gecompileerd wordt terwijl er een pagina word geladen, gaan we de code pre-compileren. Dit scheelt behoorlijk in laadtijd van pagina’s die niet in de cache geladen zijn. Om de code te compileren moet het volgende commando via SSH uitgevoerd worden in de public_html:

php bin/magento setup:di:compile

Stap 4. Instellen productie mode

Bij Magento 2 wordt er gebruikt gemaakt van modi (meervoud), deze bepalen welke functionaliteiten er aanstaan. Bij een verse installatie van Magento 2 staat deze in default modus. Echter zijn er ook twee andere mogelijkheden die wellicht veel beter bij jou passen.

> Default – De standaard modus waarin Magento 2 Geïnstalleerd wordt. Deze is niet geschikt voor productie en ook niet voor ontwikkeling. 
> Developer – Deze modus is alleen bedoelt voor ontwikkeling van de Magento 2 store. In deze modus staat automatische code compilatie bij het laden van een pagina geactiveerd naast geavanceerde debugging, constom X-Magento-* http-request en response headers. Door al deze functionaliteiten vertraagd de Magento 2 shop enorm, hier moet dus kritisch naar gekeken worden.
> Production – Deze modus is bedoelt wanneer de webshop daadwerkelijk in gebruikt genomen wordt. Foutmeldingen worden niet getoond, automatische code compilatie staat uit, geavanceerde debugging staat uit en de custom headers worden niet getoond. Dit is de snelste modus van Magento2 en deze gebruikt je dan ook als de site live gaat/is. 

Om de modus van je Magento 2 te zien gebruik je het volgende commando:

php bin/magento deploy:mode:show

Om te wisselen naar productie modus :

php bin/magento deploy:mode:set production

Stap 5. Herindexatie uitvoeren

Om nog één keer de volledige catalogus, prijs regels etc. goed te zetten herindexeren we de shop nogmaals. Dit kan via SSH (wat is SSH?)  middels het volgende commando:

php bin/magento indexer:reindex

Stap  6. Cache activeren

Zoals gebruikelijk bij Magento 1 is het inschakelen van de cache nog steeds erg belangrijk, nog vaak zien wij performance problemen gerelateerd aan cache systemen die uitgeschakeld staan. Dit levert grote snelheidsverliezen op.

Om deze in te schakelen gaat je in de backend naar: Systeem > Cache Management. 
Selecteer alle cache-typen en kies links boven voor inschakelen daarna op indienen.

Stap  7. Instellingen activeren

Om alle instellingen die we in de voorgaande stappen hebben uitgevoerd te activeren dienen we nog maal de cache te legen. Log in met SSH (Nog niet verbonden met SSH? Doe dat dan eerst. Het verbinden met SSH kan op drie manieren. Voor alle drie de manieren hebben wij een handleiding geschreven: SSH verbinden met Windows, SSH verbinden met Mac OS X of SSH verbinden met Linux.) op de server van jouw domeinnaam. Voer de volgende commando’s uit in de public_html folder.

php bin/magento cache:clean

php bin/magento cache:flush

Conclusie

De laatste stap die nu nog rest is het testen van de website en meten of de snelheid naar wens is, uiteraard kunnen de resultaten per shop sterk verschillen. De snelheid is met name afhankelijk van het gebruikte template en de extra third-party modules die geïnstalleerd zijn.

De hosting is ook een belangrijk onderdeel in de snelheid van de shop, daarom zijn al onze Magento 2 hostingpakketten geoptimaliseerd voor het gebruik van Magento 2.

Contact

Mocht je toch nog vragen hebben naar aanleiding van deze handleiding, neem dan contact met ons op. Je kunt ons bereiken via info@skyberate.nl of 0316-712000

in Magento 2
Heeft deze handleiding jouw vraag beantwoord?