Page Speed, come avere pagine veloci su tutti i device

La velocità di caricamento delle pagine web (Page Speed) è un fattore critico di successo di qualsiasi attività online. La Page Speed ha infatti
un impatto importante sull’esperienza dell’utente: secondo diverse ricerche, i visitatori di siti web ed e-commerce sono disposti ad attendere il caricamento delle pagine
al massimo una manciata di secondi (di solito, 3) prima di passare a un competitor.
Non è quindi un caso che le grandi piattaforme web, come i motori di ricerca, gli e-commerce e i social network, puntino a
fornire i propri contenuti in forma pressoché istantanea su tutti i device nonostante l’enorme volume di traffico cui sono soggetti.
Inoltre, la Page Speed è ufficialmente
un fattore di ranking di Google. In un universo online in cui i brand si danno battaglia a colpi di SEO e contenuti per scalare la classifica della SERP, non può mancare un investimento finalizzato a migliorare la visibilità dei contenuti stessi.
Page Speed, come rilevarla e i fattori determinanti
Per accelerare il caricamento delle pagine web (Page Speed) occorre intervenire in modo puntuale su diversi fattori. In particolare, su tutti quelli che influenzano il tempo che intercorre
tra la richiesta dell’utente (es., una ricerca nell’e-commerce)
e la visualizzazione dei risultati sul browser.
In un precedente intervento, abbiamo citato alcuni
KPI da monitorare,
scomponendo il concetto di Page Speed in diversi indicatori tecnici: tra quelli più significativi, il
Time to First Byte (TTFB), il
Time to interact, i
tempi di rendering del browser ecc.
Se per valutare la velocità di distribuzione delle pagine su tutti i device può venirci in aiuto un tool come
Page Speed Insights di Google, un discorso decisamente più complesso è intervenire in modo efficace per ottimizzarla.
A tal fine, occorre per prima cosa
evidenziare i fattori che incidono sulla Page Speed. Senza pretese di esaustività, li si può dividere in due categorie:
- l’ottimizzazione del codice e dei contenuti della pagina;
- le performance lato server, in termini di capacità di elaborazione, latenza e larghezza di banda.
A tutto ciò si aggiungono molte altre dimensioni di analisi, quali tipologia di dispositivo, browser, country di navigazione, categoria di pagina visitata ecc.
Page Speed e strumenti di ottimizzazione
Ottimizzare il codice del sito è un’attività complessa, ma al tempo stesso fondamentale per
evitare un sovraccarico di task lato server e di
trasmettere al browser contenuti non ottimizzati, che appesantiscono la pagina e ne rallentano la visualizzazione.
L’esempio d’elezione è quello delle
immagini, che vanno
sempre dimensionate in modo corretto e compresse adottando l’algoritmo (es., JPG, PNG o WebP) più adatto in base al caso specifico. A titolo d’esempio, JPG è un algoritmo lossy (con perdita di qualità) molto efficiente, ma non supporta le trasparenze, a differenza di PNG e di GIF.
Il concetto di compressione dei contenuti, inoltre, riguarda tutti gli elementi costitutivi della pagina web, compresi l’HTML, i fogli CSS e gli script JS: attraverso la
compressione GZIP è possibile dimezzarne (e anche più) il peso, delegando al browser il compito di estrarne e interpretarne il contenuto.
Un’altra ottimizzazione consiste nell’inviare al browser
solo i file strettamente necessari all’attività posta in essere dall’utente: ne è un esempio il
lazy loading, che trasmette al browser solo le immagini della porzione visibile di pagina. Un risultato analogo si ottiene usando la proprietà CSS
content-visibility, che evita vengano caricati contenuti inutili perché – appunto – non visibili.
Infine, ma non per importanza, occorre ragionare sull’
ottimizzazione del percorso di rendering, facendo in modo che l’ordine e l’esecuzione degli elementi della pagina siano ottimizzati in funzione del comportamento dell’utente. Ciò significa, a titolo d’esempio,
precaricare file necessari (es., CSS prioritari) e rinviare a un momento successivo degli script JS non indispensabili nell’immediato.
Il caching, le CDN e le performance lato server
Un discorso a sé merita il
caching, uno dei mezzi in assoluto
più efficaci per accelerare la visualizzazione delle pagine web. Il caching consiste nel memorizzare copie – lato server e/o client – di elementi costitutivi delle pagine web proprio per minimizzare la fase di elaborazione e, di conseguenza,
accelerare sia la trasmissione (server) che la visualizzazione (client).
Il caching consente inoltre di introdurre il concetto di
performance lato server. È infatti palese che l’ottimizzazione del codice sorgente non possa nulla di fronte a
un server inadatto a gestire i volumi di richieste cui il sito è soggetto. È dunque fondamentale, nella valutazione del servizio di hosting e del partner che lo eroga, considerare parametri che incidono sulle performance: la banda garantita, la condivisione o meno delle risorse, la quantità e il tipo di RAM, la tipologia di storage, i processori e molto altro.
Infine, ma non per importanza, la Page Speed può essere ottimizzata proprio
mediante l’uso di una (o più) CDN, che oggi rappresentano una vera e propria necessità per qualsiasi attività professionale online. Semplificando, una Content Delivery Network è una
rete di server geograficamente diffusa. Sfruttando il meccanismo del caching, la CDN replica (in modo
smart) i contenuti del server di origine (quello che ospita il sito web) su quelli presenti nel perimetro di rete (edge), facendo sì che il contenuto richiesto dall’utente sia sempre “vicino” ad esso. Tutto ciò è fondamentale per abbattere la
latenza, e soprattutto per
mantenerla stabile a prescindere dalla distanza tra il server di origine e il visitatore.
Mai far aspettare i clienti online: passa subito a una Multi-CDN!
Perché, come e quando usarla per il tuo business online.
SCOPRI DI PIÙ »
Add a date
White paper