A tutti piace vincere facile, diciamoci la verità. Ho deciso di regalarti un metodo semplicissimo per diventare un killer letale e fare meglio del 99% delle agenzie e sviluppatori web che vendono progetti li fuori, in quella giungla di siti eCommerce, composto semplicemente da una scaletta, una serie di punti che puoi seguire per ottenere dei risultati.

Ma come è possibile?

Permettimi di precisare una cosa importante: questo “trucco” è semplice ma non per questo tutti ci arrivano. Deriva dalla mia personale esperienza di anni di Frontend e, in particolare, di Magento. Alla fine, ti dimostrerò anche come quasi tutti li fuori non seguono questi banali consigli. Ma partiamo subito con la sostanza.

Numero 1. Elimina tutte le inclusioni delle risorse inutili

Sai bene se lavori da qualche tempo con Magento, che questa potente piattaforma è nata utilizzando la libreria JavaScript PrototypeJS e quando ancora non esistevano i framework come Bootstrap e simili. Per questo motivo, nel tuo frontend vengono richiamati una quantità di file che non ti servono più. In particolare, puoi tranquillamente eliminare subito i seguenti file:

  • /js/lib/ccard.js
  • /js/scriptaculous/builder.js
  • /js/scriptaculous/effects.js
  • /js/scriptaculous/dragdrop.js
  • /js/scriptaculous/controls.js
  • /js/scriptaculous/slider.js
  • /skin/frontend/rwd/demo/css/styles-ie8.css
  • /skin/frontend/rwd/demo/css/madisonisland-ie8.css

Numero 2: Inserisci solo i file che ti servono in quella pagina

Consiglio banale? Solo in apparenza. È infatti probabile che anche tu stia facendo questo errore. Facciamo un esempio così ci capiamo.

Hai uno slider nel sito? E in quali pagine ce l’hai?
Bene, ti sarai dato una risposta, spero. E la risposta di solito è: lo slider è presente solo nella homepage.

Ora chiediti: in quali pagine richiamo i file CSS e JavaScript necessari al funzionamento dello slider?

Esatto, la riposta probabilmente sarà: richiamo i file in tutte le pagine.
Se non è così, bene, bravo a te o agli sviluppatori che hanno implementato le cose per bene. Invece, per la maggioranza: inizia a pulire il tuo codice.

Devi fare un controllo preciso: ogni funzionalità (o plugin, o modulo, chiamala come vuoi) che implementa qualcosa nel frontend, si porta dietro almeno il CSS e spesso anche il codice JavaScript.

Questi file vanno inseriti e quindi caricati SOLO nelle pagine dove davvero servono. Perché continui ad integrare il plugin dello slider anche nel carrello?? 🙂

Numero 3. Inserisci un sistema di lazy loading nel tuo sito Magento

Semplicemente, prova ad installare localmente o nella tua area di staging questo plugin: https://www.mgt-commerce.com/magento-lazy-load-images.html

Si tratta di un plugin che implementa una funzionalità ormai esistente da ANNI ma che su Magento nessuno sembra prendere in considerazione: il lazy loading. Significa, semplicemente, che le immagini vengono mostrate e caricate solo quando l’utente visualizza l’area della pagina nel suo monitor. Mi sembra un’ottimizzazione notevole!

PS: adesso prova a controllare i siti Magento che conosci e verifica questa “anomalia”!