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.

Add a date

White paper

Richiedi la tua prova gratuita

Ehi! Stai già andando via?

Iscriviti alla nostra newsletter per restare aggiornato sulle novità dell’universo Criticalcase