Cosa hanno in comune la caccia ai mammut e Page Speed?

Michael Rudin

2.10.2019

Traduzione: Leandra Amato

Rapidi tempi di caricamento sono molto importanti per un sito web. Vogliamo che tu ti muova alla velocità della luce nell'universo Digitec Galaxus. Basta con i clic di rabbia a causa dei lunghi tempi di caricamento! Stiamo lavorando sodo per diventare il negozio online con i tempi di caricamento più rapidi d’Europa.

L'uomo come essere complesso è il prodotto del suo genoma, lo stesso di 10 000 anni fa. Il suo ambiente no. Viviamo in un mondo completamente digitalizzato dove non cacciamo più mammut. La velocità di caricamento delle pagine web (page speed) è quindi importante soprattutto per due motivi:

1. Human limitations (limitazioni umane): la nostra memoria a breve termine è smemorata. Tralasciamo ciò che non è importante. La page speed è importante per non dimenticare ciò che vogliamo quando navighiamo da un sito web all'altro e richiamiamo un sito a caricamento lento.
2. Human aspirations (ambizioni umane): vogliamo il controllo delle nostre azioni. Specialmente quando interagiamo con i computer. La velocità di caricamento di un sito web è importante per non dover sottostare ai capricci di un computer.

Un fatto divertente: secondo uno studio, il carico cognitivo durante i tempi lenti di caricamento è così stressante per una persona che può essere paragonato alla visione di un film horror. Nel nostro negozio trovi i migliori film horror.

Cosa è successo finora: It's mobile, stupid!
Qui da Digitec Galaxus abbiamo messo da parte le frecce e abbiamo smesso di dare la caccia agli antenati pelosi degli elefanti? Non proprio. C'è sicuramente ancora molto da fare quando si tratta di velocità di caricamento di un sito web. Negli ultimi anni l'argomento ha costantemente guadagnato importanza, anche da un punto di vista tecnico. Due sviluppi, in particolare, hanno contribuito notevolmente a questo risultato:

1. I siti web e le applicazioni sono oggi maturi e fortemente sviluppati e consentono al cliente una vasta esperienza sulla pagina web. Tali interazioni richiedono logica e codice, tipicamente costruito con tecnologie come Java Script.
2. Da alcuni anni gli utenti di Internet accedono ai siti web principalmente con il proprio smartphone. Gli smartphone in genere hanno meno potenza disponibile per eseguire applicazioni rispetto a un computer. Questo può peggiorare l'esperienza, se le pagine web JavaScript pesanti non vengono eseguite altrettanto velocemente o visualizzate in modo interattivo.

Secondo il modello RAIL di Google, il tempo di caricamento (load) di un sito web rappresenta una delle quattro dimensioni rilevanti per la valutazione e la concezione dell'esperienza di performance percepita di un sito web. Le altre tre dimensioni sono risposta (response), animazione (animation) e inattività (idle), che nel complesso cercano di riflettere l'esperienza di performance percepita da te come utente.

Il front-end stack isomorfo porta velocità
È importante capire che il tempo di caricamento non è un singolo momento nell'animazione di caricamento di un sito web. Pertanto, non può essere misurata con un solo sistema metrico. Per misurare in modo ottimale il nostro tempo di caricamento, ci atteniamo al concetto di Google e ci orientiamo nell'area "Load" del modello RAIL alle "User Centric Performance Metrics". Le User Centric Performance Metrics descrivono il successo dei clienti come metriche di cronometraggio basate su pietre miliari, cioè in secondi.

Per definire le metriche, è importante conoscere le esigenze di base del cliente in modo da poterle misurare. Quando si carica un sito web, un cliente richiede una risposta rapida, soprattutto in tre tappe fondamentali, al fine di valutare in modo positivo la sua esperienza con il sito web.

Con il passaggio del nostro front-end a un front-end stack isomorfo la pagina non viene più resa in una sola volta sul server, ma progressivamente sul client. Questo ci dà la possibilità di assegnare un valore individuale ad ogni pixel del sito web. È facile capire che vogliamo visualizzare gli elementi visivi in Viewport nel modo più rapido e prioritario possibile.

Al fine di misurare le esigenze dei clienti e di capire quando un sito web fornisce un feedback visivo sotto forma di elementi renderizzati, estendiamo la nostra tabella con le seguenti tre metriche e il loro significato:

Le metriche possono essere illustrate in un’asse dei tempi di caricamento di una pagina web come segue:

La combinazione giusta è quello che ci vuole
La misurazione di queste metriche può provenire da due fonti di dati: i dati reali dei clienti e le cosiddette misurazioni sintetiche.

I dati reali dei clienti, noti anche come RUM (Real User Monitoring), utilizzano i dati dei clienti reali quando richiamano una pagina. Quindi da tutti, non importa se sei vicino ad un'antenna 5G o se stai navigando in un tunnel in montagna nel nostro negozio online. Per noi questa è la verità nuda e cruda e rappresenta esattamente l'esperienza che stai vivendo.

Le misure sintetiche, invece, rappresentano misure che avvengono sotto forma di simulazioni e quindi cercano di modellare l'esperienza del cliente. Gli strumenti noti per fare questo sono Lighthouse di Google e WebPageTest.org. Con diverse impostazioni, le performance di caricamento delle pagine web possono essere misurate utilizzando criteri quali la velocità del dispositivo o della rete.

Per poter mettere in relazione le misurazioni della performance, ci siamo accordati su chiari budget. Questo ci permette di chiarire se i tempi di caricamento soddisfano i nostri requisiti per un’eccellente user experience. I nostri budget sono cifre assolute, che vogliamo raggiungere al 95%. Quindi il 95% di tutte le pagine viste dovrebbe essere più veloce della media nelle singole metriche. Di conseguenza, possiamo estendere la nostra tabella come segue:

I budget di performance sono standard industriali e vengono utilizzati come metro di valutazione delle prestazioni delle pagine. I budget si basano in gran parte sul lavoro di
Robert B. Miller "Response Time in Man-Computer Conversational Transactions del 1968. Quando si interpretano i valori misurati con i budget, la performance della pagina non deve essere intesa come un singolo momento dell'animazione di caricamento di un sito web, come indicato inizialmente. La combinazione di tutte le metriche viene combinata nel prodotto finale per creare un’esperienza utente soddisfacente.

Un investimento per il futuro
Oltre ai vantaggi elementari di un sito web più veloce per il cliente, i siti web veloci sono anche parte importante di ogni visibilità. Questo si riferisce al punteggio delle nostre pagine nei confronti di motori di ricerca come Google. Con il lancio dell'iniziativa "Let's make the web faster " nel 2009, Google ha investito molto in un web veloce e facile da usare e preferisce siti web con tempi di caricamento rapidi nei suoi ranking. La performance è quindi un importante fattore di ranking.

L'argomento sta acquistando slancio per noi e stiamo sperimentando molto con modifiche al nostro codice base per migliorare ulteriormente la velocità. Ti terremo aggiornato.

Michael Rudin

Product Owner

michael.rudin@digitecgalaxus.ch

Ossessionato dalla risoluzione di problemi digitali. L'outcome supera l'output. Non seguo ciecamente tutte le tendenze tecnologiche. Non simulo mai il successo di un prodotto con KPI casuali. Non mi arrendo se un'idea non funziona. La vita è un'esperienza. Amen. più

Segui

Potrebbero interessarti anche questi articoli