Rendere veloce una vetrina Shopify senza combattere la piattaforma

Gestiamo diverse vetrine su Shopify, tra cui Vowly Store e Paperly. La piattaforma non è il collo di bottiglia che si immagina. Quasi ogni vetrina lenta che ci è stato chiesto di esaminare era rallentata dalle aggiunte, non dalle fondamenta.

Prima di tutto contate le terze parti

Prima di toccare un template, aprite il pannello di rete e contate quanti host distinti contatta una scheda prodotto. Un negozio attivo da due anni ne raggiunge tipicamente una dozzina: analytics, widget di recensioni, bolla di chat, convertitore di valuta, app di upsell e due tag manager perché nessuno ha rimosso il primo.

Ognuna è stata aggiunta per un motivo, e quasi tutti erano validi. Ma nessuno misura il costo cumulativo, perché ogni aggiunta sembrava piccola il giorno in cui è stata fatta. Questo audit non è un esercizio tecnico ma commerciale. Per ogni script chiedete cosa rende e quanto costa in tempo sul thread principale. Diversi bocceranno nettamente.

Le immagini restano il guadagno maggiore

In un negozio che vende poster e cartoleria le immagini sono il prodotto e dominano il peso delle pagine. I rimedi sono noti e vengono comunque saltati di routine:

• Servire formati moderni — la CDN lo fa se richiesto, e il risparmio rispetto al JPEG è sostanziale a parità di qualità visiva.
• Dimensionare la sorgente al riquadro renderizzato, con un srcset corretto. Mandare un'immagine da 2000 px in uno slot da 400 px è lo spreco singolo più comune in una griglia prodotti.
• Dare dimensioni esplicite a ogni immagine, così il layout non salta durante il caricamento. Lo spostamento del layout è insieme un segnale di ranking e un fastidio reale.
• Caricare con priorità solo ciò che sta sopra la piega e rimandare il resto — ma decidendo consapevolmente, invece di ritardare per sbaglio l'immagine principale.

I caratteri meritano più scetticismo

Tre pesi di due famiglie, caricati da un host esterno, costano più di quanto si creda: una connessione in più, un ritardo di rendering e un riflusso visibile quando avviene lo scambio.

Ospitate i file voi stessi, riduceteli ai soli caratteri usati, precaricate l'unico peso visibile sopra la piega e impostate una strategia di visualizzazione che lasci il testo leggibile durante il caricamento. Se vendete in più mercati europei, il sottoinsieme deve includere i caratteri accentati necessari — un subset senza dieresi sembrerà a posto in test e rotto in Germania.

Non confondete la vetrina con il checkout

Un confine utile: la vetrina è vostra da ottimizzare, il checkout no — e va benissimo così. Pagamenti, antifrode e calcolo delle imposte sono esattamente ciò che un team piccolo non dovrebbe ricostruire.

Il lavoro di performance che conta commercialmente avviene prima del checkout — su pagina collezione, scheda prodotto e carrello, dove il visitatore decide se proseguire. Un negozio su commessa lì porta peso extra, perché le interfacce di personalizzazione aggiungono script e anteprime proprie.

Misurate ciò che vive il cliente

I punteggi da laboratorio servono a trovare regressioni e ingannano come obiettivo. Un test di laboratorio non ha il telefono più vecchio del cliente, né la sua rete, né il banner dei cookie alla seconda visita. I dati sul campo da sessioni reali, segmentati per classe di dispositivo e per mercato, dicono dov'è davvero il problema — spesso su mobile in un solo paese anziché ovunque.