I payload di rete di grandi dimensioni sono fortemente correlati a lunghi tempi di caricamento. Inoltre, comportano un costo per gli utenti; ad esempio, gli utenti potrebbero dover pagare per avere una maggiore quantità di dati cellulare. Pertanto, ridurre la dimensione totale delle richieste di rete della tua pagina è positivo per l'esperienza degli utenti sul tuo sito e sui loro portafogli.
Come il controllo del payload di rete Lighthouse ha esito negativo
Lighthouse mostra le dimensioni totali in kibibyte (KiB) di tutte le risorse richieste dalla tua pagina. Le richieste più grandi vengono presentate per prime:
In base ai dati di archivio HTTP, il payload di rete mediano è compreso tra 1700 e 1900 KiB. Per aiutare a identificare i payload più elevati, Lighthouse segnala le pagine le cui richieste di rete totali superano i 5000 KiB.
Come ridurre le dimensioni del payload
Cerca di mantenere le dimensioni totali in byte al di sotto di 1600 KiB. Questo target si basa sulla quantità di dati che possono essere teoricamente scaricati con una connessione 3G raggiungendo comunque un tempo all'interattività di massimo 10 secondi.
Ecco alcuni modi per mantenere ridotte le dimensioni del payload:
- Rimanda le richieste finché non sono necessarie. Vedi il Pattern PRPL per un possibile approccio.
- Ottimizza le richieste in modo che siano il più possibile ridotte. Le possibili tecniche includono:
- Memorizza le richieste nella cache in modo che la pagina non scarichi nuovamente le risorse in caso di visite ripetute. Consulta la pagina di destinazione dell'affidabilità della rete per scoprire come funziona la memorizzazione nella cache e come implementarla.
Indicazioni specifiche per lo stack
Angular
Applica la suddivisione del codice a livello di route per ridurre al minimo le dimensioni dei bundle JavaScript. Inoltre, è consigliabile memorizzare gli asset nella cache con il service worker Angular.
Drupal
Valuta la possibilità di utilizzare gli stili di immagini adattabili per ridurre le dimensioni delle immagini caricate nella pagina. Se utilizzi Views per mostrare più contenuti in una pagina, potresti implementare l'impaginazione per limitare il numero di contenuti mostrati in una determinata pagina.
Joomla
Potresti mostrare estratti nelle categorie dei tuoi articoli (una soluzione comune è un link "Scopri di più"), riducendo il numero di articoli mostrati in una determinata pagina, suddividendo i tuoi post lunghi in più pagine o utilizzando un plug-in per il caricamento lento dei commenti.
WordPress
Potresti mostrare degli estratti nell'elenco dei tuoi post (puoi usare il tag "altro"), riducendo il numero di post mostrati in una determinata pagina, suddividendo i post lunghi in più pagine o utilizzando un plug-in per il caricamento lento dei commenti.
Risorse
Codice sorgente per il controllo Evita payload di rete enormi