Migliorare le performance di Magento 2

Tempi di caricamento pagina sotto al secondo su Magento 2

Rendere l’esperienza utente sul vostro eCommerce fruibile e coinvolgente è fondamentale per aumentare il tasso di conversione, le vendite e fidalizzare i clienti. Le performance dell’eCommerce hanno un’influenza importante su questo tema e come tutti ben sappiamo Magento 1 era molto ostico su questo punto.

Magento 2 ha migliorato sensibilmente le sue performance rispetto a Magento 1, dai benchmark effettuati su due versione out-of-the-box di Magento (Magento Enterprise 2.0 e la Magento Enterprise 1.14) sono emersi i seguenti miglioramenti su diverse metriche:

  • +39% di ordini processati per ora.
  • -66% di tempo per aggiungere al carrello un prodotto.
  • -51% di tempo per concludere un checkout.
  • Tempi di risposta migliorati per la navigazione catalogo.

In più vi sono diverse tecnologie integrate con Magento 2, come ad esempio Varnish, Redis, Nginx, sistemi di Full page cache che consentono un miglioramento ulteriore delle performance di Magento 2.

Ottimizzare le performance di Magento 2

Il caricamento di una pagina prodotto in un eCommerce Magento 2 può richiedere anche più di 3 secondi, di sicuro troppo per garantire all’utente un’esperienza di navigazione ottimale. Vediamo come migliorarlo con l’obiettivo di ottenere un tempo di caricamento inferiore al secondo.

Ottimizzare le performance di Magento 2 passo passo

  • Step 1: Abilitare le tabelle flat per categorie e prodotti.
  • Step 2: Unire file CSS e file JS.
  • Step 3: Abilitare Content Delivery Network.
  • Step 4: Abilitare Full page cache.
  • Step 5: Ottimizzare le immagini.
  • Step 6: Abilitare compressione.
  • Step 7: Ridurre tempo di risposta del server.

Step 1: Abilitare le tabelle flat per categorie e prodotti
Per ottimizzare il caricamento dei dati dal database è necessario abilitare l’opzione Flat Catalog. Questa opzione consente di ridurre in modo concreto la complessità delle query su MySQL per caricare i vari dati presenti nelle pagine del vostro eCommerce Magento 2.

Per farlo potete andare su nel backend: Stores > Configuration > Catalog > Catalog > Storefront, ed impostate su Yes il campo Use Flat Catalog Category.

Magento 2 ottimizzare performance flat catalog
Step 2: Unire file CSS e file JS
Nello step successivo è necessario effettuare l’unione e la minificazione dei file CSS e dei file JSS del tema Magento 2, in questo modo le richieste di risorse al caricamento delle pagine diminuiscono in modo drastico e perciò migliorano la velocità di caricamento delle pagine.

Per effettuare questa ottimizzazione è necessario impostare Magento 2 in modalità produzione, eseguendo questo comando sulla vostra shell: ./bin/magento deploy:mode:set production. Dopo di che abbiamo diverse configurazioni da abilitare in backend.

Javascript

  • Stores -> Configuration > Advanced > Developer > JavaScript Settings
  • Impostare Merge JavaScript Files su Yes
  • Impostare JavaScript Files su Yes

Magento 2 ottimizzare performance merge JS
CSS File

  • Stores > Configuration > Advanced > Developer > CSS Settings
  • Impostare Merge CSS Files su Yes
  • Impostare Minify CSS Files su Yes

Magento 2 ottimizzare performance merge CSS

Una volta completate le due operazioni basterà salvare e ricreare la cache.

Step 3: Abilitare Content Delivery Network
La Content Delivery Network, meglio conosciuta come CDN è un sistema che consente di connettere i contenuti media, js e css del sito eCommerce Magento 2 a dei server geograficamente distribuiti che offrono contenuti in cache con tempi di caricamento molto performanti.

Per abilitare la CDN per Magento 2, molto semplicemente vanno impostati nel backend in: Stores -> Configuration -> General -> Web -> Base URL (Secure), gli indirizzi della o delle diverse CDN sui Static View Files e sugli User Media Files.

Magento 2 ottimizzare performance CDN

Step 4: Abilitare Full Page Cache
La full page cache, consente di distribuire dei contenuti delle pagine dell’eCommerce Magento 2 direttamente da una cache interna, andando perciò ha velocizzare il tempo di caricamento della pagina. Rispetto a Magento 1 Community, Magento 2 offre già un sistema di full page cache che potete abilitare nel backend da System -> Cache Management.

Magento 2 ottimizzare performance full page cache
Step 5: Ottimizzare le immagini
Come in ogni eCommerce, la questione immagini è critica. L’inserimento da parte degli amministratori dell’eCommerce è spesso lacunosa ed è per tanto necessario abilitare strumenti, anche di terze parti per ottimizzare le immagini al meglio, considerando che Google penalizza le pagine con immagini non ottimizzate.

Pertanto è necessario ottimizzare prima del caricamento su Magento 2 le immagini, con strumenti come TinyPNG o ottimizzare API terza parti, lo stesso TinyPNG offre un servizio gratis sino a 500 immagini per mese, che consenta un’ottimizzazione continua nel tempo ed automatizzata.

Step 6: Abilitare compressione
Una piccola modifica lato server, importante e richiesta da Google è quella di abilitare forme di compressione come ad esempio la compressione GZIP. Per farlo basta in Nginx inserire la seguente impostazione.

  • gzip_types: text/plain application/x-javascript text/javascript text/xml text/css image/x-icon image/bmp image/png image/gif; to
  • gzip_types: *;

Step 7: Ridurre tempo di risposta del server
In Magento 2, con tutte le cache abilitate, il tempo di risposta del server si assesta usualmente su 0,5 secondi, un tempo che può sembrare buono ma che viene percepito da Google come non ottimale. Per avere un netto miglioramento di questo dato, ed arrivare sino 0,1 secondi è necessario abilitare Varnish per la Full page cache di Magento 2. Per farlo basta attivare la funzionalità da: Stores -> Configuration -> Advanced -> System -> Full page Cache impostando Caching application su Varnish Cache.

Magento 2 ottimizzare performance Varnish full page cache

Aprendo la sezione Varnish Configuration dovete poi inserire le impostazioni richieste:

Magento 2 ottimizzare performance Varnish full page cache

Conclusioni

Possiamo concludere affermando che rispetto a Magento 1, la nuova struttura di Magento e le diverse tecnologie messe a disposizione consentono di ottenere in modo molto più semplice e rapido prestazioni ottime per il vostro eCommerce. Se volete approfondire questo tema, non esitate a contattarci, le nostre competenze certificate Magento insieme a quelle dei nostri partner certificati Amazon sono in grado di fare decollare le performance del vostro eCommerce Magento 2.