Ben ritrovati a un nuovo approfondimento di SeoRoma!
Cos’è Google PageSpeed Insights
Google PageSpeed Insights è uno dei più importanti strumenti che vengono utilizzati per valutare le prestazioni di un sito, cosa che è possibile misurare attraverso, di base, i tempi di caricamento delle pagine. La velocità del sito web è un parametro essenziale per valutare il successo di un portale web: non soltanto per i motori di ricerca, ma anche e soprattutto per offrire una buona esperienza di navigazione agli utenti. L’ottimizzazione dei siti per ridurre i tempi di caricamento è un argomento sul quale Google è tornato più e più volte. Ad oggi, è considerato un vero e proprio ranking factor, un fattore di posizionamento sul quale qualsiasi attività SEO dovrebbe, nella migliore delle ipotesi, basarsi.
Come velocizzare un sito per il Google PageSpeed Insights
Effettuare l’operazione di ottimizzare il sito in questi termini significa semplicemente una cosa: velocizzare il caricamento delle pagine web nel modo più efficente possibile. Per quello che ne sappiamo, il tempo di caricamento ideale di una pagina web dovrebbe essere di qualche centinaio di millisecondi, considerando in essi svariati aspetti che influiscono sulle tempistiche, e che possiamo riassumere (semplificando un po’ i termini del discorso) tra:
- TTFB (Time To First Byte) – il tempo necessario perchè il primo byte arrivi a destinazione, cioè perchè il rendering della pagina web possa iniziare
- il tempo necessario per risolvere la chiamata DNS del dominio della pagina, tempo influenzato dallo stato dei DNS server in quel momento
- il tempo necessario per effettuare tutte le chiamate HTTPS (al netto di ottimizzazioni ulteriori dovute alla presenza ed al supporto di HTTP/2)
- il tempo necessario perchè le chiamate al database vengano risolte
- il tempo necessario perchè gli script e i CSS finiscano di caricare
- il tempo necessario per risolvere la chiamata di per sè, quindi considerando gli eventuali, imprevedibili ritardi dovuti alla connettività di rete dell’hosting
Dietro ogni singola chiamata ad una pagina di un sito si nascondono svariate insidie, come visto: ed è per questo che tool tende ad essere molto “pignolo” nella sua valutazione delle pagine, arrivando a fornire valutazioni pessime anche a siti apparentemente impeccabili. Questo non deve turbare più di tanto, alla fine: il limite sui pochi millisecondi nel tempo di caricamento non è banale da raggiungere, e questo soprattutto perchè i vari servizi di hosting spesso non sono in grado di rispettarli di per sè. Se vi rivolgete a servizi di scarsa qualità o molto economici, sarà difficile che riusciate ad abbattere il TTFB (ad esempio), per quanto poi riuscire a velocizzare le chiamate HTTP sia un’arte da affinare con l’esperienza, e che molti dei più esperti risolvono sfruttando:
- chiamate minificate (minify), ovvero compressione dei caratteri necessari nei file CSS e JS, mantenendo intatto il potere espressivo;
- riduzione del numero di chiamate HTTPS (intervenendo lato codice sul theme, ad esempio);
- software di caching lato client e lato server;
- software di compressione delle pagine (ad esempio GZIP);
- ottimizzando l’uso del database mediante indici MySQL ed eventualmente transient (quelli di WordPress sono molto potenti ed incredibilmente poco sfruttati nella pratica);
- mettendo online una versione completamente statica del proprio sito (quindi senza codice PHP e senza database MySQL: una sorta di cache statica generata in anticipo dal server con opportuni plugin), ovviamente considerando i pro ed i contro di una scelta del genere. Di fatto, in questo caso il sito è più veloce ma può diventare ovviamente problematico da gestire, se non impostato in modo adeguato.
Lighthouse: la novità in arrivo da Google
L’aggiornamento sul Google Webmaster Blog ufficiale del novembre 2018 afferma che:
Today, we’re happy to announce that Pagespeed Insights (PSI) now uses Lighthouse as its analysis engine. This allows developers to get the same performance audits and recommendations everywhere: on the web, from the command line, and in Chrome DevTools. PSI also incorporates field data provided by the Chrome User Experience Report (CrUX). Version 5 of the PageSpeed Insights API will now provide CrUX data and all of the Lighthouse audits. Previous versions of the PSI API will be deprecated in six months.
In pratica è stato integrato nel motore del sistema PSI (Pagespeed Insights)Lighthouse, che rappresenta uno strumento open source per migliorare la qualità delle pagine web, molto più evoluto di quanto non fosse in precedenza. A differenza di altri tool, infatti, adesso è integrato in Google Chrome e può essere utilizzato per valutare i tempi di caricamento delle pagine pubbliche e private (soggette ad autenticazione).
In passato Google si appoggiava a diverse piattaforme esterne, le quali restituivano ognuno suggerimenti e valori differenti che potevano confondere gli sviluppatori: la nuova versione di Pagespeed Insights racchiude invece al proprio interno Lighthouse, un tool molto noto fra i webmaster in quanto consente di produrre report utili a eseguire analisi di ottimizzazione dei siti web. Il risultato è una piattaforma che migliora notevolmente l’efficacia dei dati e delle metriche di misurazione della validità delle pagine.
Google ci ha fatto anche sapere di utilizzare ora un motore di analisi basato su Lighthouse, che perciò si appoggia ai dati forniti dal Chrome user Experience Report. Entro 6 mese verranno deprecate che le precedenti versioni delle API utilizzate.
Le novità di Google PageSpeed Insights
Il nuovo strumento di analisi include diversi report e funzioni di analisi utili a determinare quali elementi incidono sulla velocità di caricamento.
PageSpeed Insight ora include i cinque livelli di analisi dello strumento:
- accessibilità
- SEO
- performance
- best practice
- progressive web apps
I report del nuovo PSI sono divise in una doppia finestra, rivolta alla visualizzazione da desktop e da mobile.
Il nuovo tool introduce dei report specifici orientati a fornire differenti generi di informazioni: vediamo in cosa consistono.
Field Data
Il tool offre metriche in termini di performance sul mondo reale e sull’origine degli elementi.
Contiene the First Contentful Paint (FCP) and the First Input Delay (FID) ricavati dal Chrome User Experience Report. Non tutti i siti possono mettere a disposizione dei valori da offrire all’utilizzatore.
I dati provenienti da Chrome User Experience Report sono aggiornati giornalmente e vengono aggregati negli ultimi 28 giorni.
Labdata
Il tool offre un’analisi paragonabile a un dispositivo mobile mostrando le metriche rilevanti per Time to interactive, Speed Index, First Contentful Paint, First Paintful Paint, Estimated Input Latency.
Si avvale delle funzioni di Lighthouse per simulare il comportamento di un dispositivo mobile e restituisce un valore tra 0 e 100. Tali risultati sono divisi in tre livelli, dove quello da 90 in su rappresenta il più apprezzabile.
Opportunities
Il tool evidenzia le possibilità che abbiamo a disposizione per migliorare le performance della pagina, sotto forma di inefficienze da rimediare.
Vengono suggeriti ad esempio:
- le risorse da eliminare che bloccano la visualizzazione
- il tempo di risposta del server da ridurre
- il codice CSS inutilizzato
- l’opportunità di pubblicare le immagini in formato più recente
- la necessità di codificare le immagini in modo più efficace
A partire da queste osservazioni possiamo avere una panoramica abbastanza puntuale degli interventi che possiamo realizzare per aumentare la velocità del sito e sui vantaggi che possiamo ottenere.
Diagnostics
Il tool offre una stima dei miglioramenti che si possono ottenere in termini di performance delle pagine.
Indica l’efficienza di vari elementi come la cache, il playload, i javascript e altri ancora.
Tra i suggerimenti più importanti riportati ci sono:
- Indicatori e misure User Timing: ti consiglia di dotare la tua app dell’API User Timing per misurare le prestazioni reali durante le esperienze utente chiave.
- Utilizzare la funzione CSS font-display per assicurarti che il testo sia visibile agli utenti durante il caricamento dei caratteri web.
- Evitare di utilizzare DOM di dimensioni eccessive che utilizzano troppa memoria e provocano calcoli di stile più lunghi
- Ridurre il tempo di elaborazione di javascript, ad esempio per mezzo della pubblicazione di payload javascript di dimensioni inferiori
- Allungare la durata della cache per le pagine soggette a visite abituali
Audit
Indica i risultati ottenuti dai lavori di ottimizzazione su Javascript, CSS e altri elementi.
Google sta rilasciando anche una nuova versione delle API alle quali si appoggia PageSpeed Insights. La versione 5 della API PSI fornirà il Chrome User Experience Report Data, in aggiunta alle informazioni restituite da Lighthouse. Nel corso dei prossimi sei mesi le precedenti versioni API di PageSpeed Insights verranno deprecate.
Dove trovare il nuovo tool
Il nuovo tool è possibile rintracciarlo utilizzando Google Chrome, requisito di base per poterne godere dei numerosi vantaggi, oltre alla comodità per lo sviluppatore di ritrovarsi tutti gli strumenti integrati direttamente dentro al browser. Si può accedere al tool mediante il pannellino di Chrome in corrispondenza del tool per sviluppatori (DevTools), cliccando sulla parte in corrispondenza di Audits.
Vediamo fin da subito che sono presenti varie opzioni all’interno del tool, che dovrà essere avviato selezionando le opzioni desiderate e cliccando poi sul bottone blu in basso, Run Audits: la prima, in corrispondenza di Device, permette di scegliere una vista Mobile o Desktop del nostro sito, in modo da poterne apprezzare le differenze direttamente. Gli audit possono riguardare vari aspetti del sito, quindi ad esempio Performance generali, rispetto dello standard Progressive Web App, rispetto delle Best Practices generali, Accessibility e standard SEO. Il throttling permette inoltre di simulare una sorta di “regolatore” di velocità della CPU del client, cosa che può essere utile in determinate situazioni da valutare nella sua interezza.
Come valutare le prestazioni del proprio sito
Il nuovo approccio è molto più tecnico di quanto non fosse in passato, e soprattutto tende ad essere piuttosto drastico e “cattivello”: saranno pochi i siti a rispettare lo standard imposto da Google, e soprattutto non sarà sempre chiaro come agire per valorizzare e potenziare i tempi di caricamento. I parametri dell’audit generato, infatti, saranno 4 indici percentuali riassuntivi – che indicheranno lo stato di salute del sito in termini SEO, Performance, Best practices, Accessibility, ma nello specifico sarà necessario approfondire i singoli parametri delle voci presentate:
- First Contentful Paint: il tempo che impiega il browser prima di iniziare a renderizzare l’alberatura HTML della pagina
- Speed Index: indice medio di velocità, più è piccolo meglio è
- Time to Interactive: questo è un parametro di UX (User eXperience) che tende a misurare i tempi entro i quali diventa possibile per l’utente interagire con la pagina, senza ulteriori attese (ad esempio JS che sta ancora caricando)
- First Meaningful Paint: identifica il momento in cui l’utente percepisce che il sito ha caricato (il tool fornisce anche delle screenshot progressive di come avvenga il caricamento, ed è importante che le parti in cui si vedono pagine vuote oppure parzialmente caricate non siano troppo)
- First CPU Idle: il tempo necessario all’utente per garantirgli un’interazione anche minima (ad esempio: un form di ricerca che funziona, nonostante la pagina non abbia finito di caricare nella sua interezza)
- Estimated Input Latency: indica la latenza media stimata dall’utente, cioè il tempo medio in cui esso percepisce che la pagina ha caricato. Se è superiore ai 100ms, in genere, corrisponde ad un utente che abbia una scarsa percezione della pagina stessa in termini di performance.
Ovviamente si tratta di un tool molto tecnico che potrebbe scoraggiare i principianti, anche perchè è decisamente crudele anche con siti apparentemente impeccabili in termini di performance: non vi spaventate troppo, pertanto, se dovesse massacrare il vostro sito con indici bassi, perchè si tratta di un tool che approccia ai tempi di caricamento delle pagine in modo innovativo e molti siti web e tecnologie annesse non sono ancora perfettamente allineate. Non c’è dubbio, comunque, che lo standard possa consolidarsi in tal senso con lo scorrere degli anni, soprattutto quando il webmaster avrà una rinnovata consapevolezza dell’importanza di questo tool per le prestazioni e per l’ottimizzazione del ROI del proprio sito web.
Hai già provato il nuovo PageSpeed Insights? Raccontami qua sotto le tue opinioni!
