Su Tilda, il lazy loading è abilitato per impostazione predefinita per tutti i siti web. Consente ai siti Web di caricarsi più velocemente, anche su dispositivi mobili.
L'implementazione del lazy loading è un altro passo nell'ottimizzazione dei siti Web su Tilda per un caricamento più veloce. Le tecnologie sono in continua evoluzione e noi lavoriamo sempre per rendere il carico ancora più veloce.
Lazy Load è un plugin che blocca il caricamento delle immagini al di fuori dell'area di visualizzazione. In altre parole, le immagini vengono caricate mentre l'utente scorre la pagina. Diamo un'occhiata a come funziona.
Selezioniamo un normale template Tilda e pubblicamolo:http://project130385.tilda.ws/
Apri la console per sviluppatori del browser, abilita l'imitazione a bassa velocità (3G) nelle impostazioni e aggiorna la pagina.
Selezioniamo un normale template Tilda e pubblicamolo:http://project130385.tilda.ws/
Apri la console per sviluppatori del browser, abilita l'imitazione a bassa velocità (3G) nelle impostazioni e aggiorna la pagina.
DOMContentLoaded: 628 millisecondi
Questo parametro indica che tutti gli script di base e HTML sono stati caricati, consentendo all'utente di visualizzare immediatamente la pagina.
Fine: 1,65 secondi
Questo parametro indica il tempo impiegato per il caricamento dell'intero sito Web.
Trasferito: 263KB
Questo parametro mostra la quantità di dati trasferiti (in byte).
Questo parametro indica che tutti gli script di base e HTML sono stati caricati, consentendo all'utente di visualizzare immediatamente la pagina.
Fine: 1,65 secondi
Questo parametro indica il tempo impiegato per il caricamento dell'intero sito Web.
Trasferito: 263KB
Questo parametro mostra la quantità di dati trasferiti (in byte).
Queste cifre sembrano molto ottimistiche, ma tutto è relativo, non è vero? Vai su Impostazioni sito → Altro e seleziona la casella di controllo "Disabilita lazy load per immagini". Testare nuovamente la pagina.
DOMContentLoaded: 697 millisecondi
Questo parametro indica che tutti gli script di base e il codice HTML sono stati caricati, il che significa che l'utente può visualizzare immediatamente la pagina.
Fine: 10,14 secondi
Questo parametro mostra quanto tempo è stato impiegato per caricare l'intero sito web.
Trasferito: 1,8MB
Questo parametro mostra la quantità di dati trasferiti (in byte).
Questo parametro indica che tutti gli script di base e il codice HTML sono stati caricati, il che significa che l'utente può visualizzare immediatamente la pagina.
Fine: 10,14 secondi
Questo parametro mostra quanto tempo è stato impiegato per caricare l'intero sito web.
Trasferito: 1,8MB
Questo parametro mostra la quantità di dati trasferiti (in byte).
Il tempo complessivo di caricamento della pagina e la quantità di dati trasferiti si sono moltiplicati.
Vediamo cos'altro possiamo imparare utilizzando PageSpeed Insights. Controlliamo la pagina con l'ottimizzazione disattivata.
Vediamo cos'altro possiamo imparare utilizzando PageSpeed Insights. Controlliamo la pagina con l'ottimizzazione disattivata.
Ora, abilitiamo il Lazy Load per le immagini:
Lazy Load blocca le immagini che non sono visibili agli utenti,
che consente ai siti Web di caricarsi più velocemente.
che consente ai siti Web di caricarsi più velocemente.
Nota
Come rimuovo il codice JavaScript e CSS che impedisce la visualizzazione della parte superiore della pagina?
Questa domanda si presenta spesso dopo aver sostenuto il test. Google sconsiglia di utilizzare gli script nella parte superiore della pagina.
In teoria, puoi rimuovere gli script. Tuttavia, devi tenere presente che si tratta di un'analisi automatizzata e non è accurata. Come abbiamo visto, le pagine si caricano molto velocemente quando è abilitato il Lazy Load perché abbiamo ottimizzato tutto quello che c'era da ottimizzare. L'analisi ha dimostrato che la rimozione degli script consente di risparmiare 0,3 secondi, ma non fa quasi alcuna differenza.
Ecco perché consigliamo di ignorare i risultati del test automatico che reagisce così male agli script nella parte superiore della pagina.
A proposito, come fa Google a superare il proprio test?
Ecco perché consigliamo di ignorare i risultati del test automatico che reagisce così male agli script nella parte superiore della pagina.
A proposito, come fa Google a superare il proprio test?
Ops!
