Dopo aver aggiunto la funzionalità di caricamento lento delle immagini native a Chrome lo scorso anno, Google ora consente agli sviluppatori di caricare iframe pesanti. Continua a leggere per saperne di più!
L’aumento del traffico web da parte di utenti mobili e di persone in tutto il mondo con capacità di connessione limitate ha spinto le aziende e gli sviluppatori a ottimizzare notevolmente la velocità di caricamento dei siti web. Tradizionalmente, quando accedi a una pagina Web, questa scarica e visualizza tutto il contenuto disponibile: immagini, icone, GIF, stili, script e così via. Come puoi immaginare, il caricamento di tutta questa roba provoca un ritardo all'avvio del sito Web, soprattutto per gli utenti con connessioni lente. Google sta cercando di eliminare questo problema già da tempo. Proprio l’anno scorso, hanno aggiunto funzionalità di caricamento lento delle immagini in Google Chrome 76. Ora Google sta offrendo la stessa funzionalità agli iframe.
Il caricamento lento carica i contenuti della pagina web su richiesta, il che significa che non verranno scaricati e visualizzati finché non scorri verso il basso e li visualizzi, diminuendo così l'avvio iniziale del sito web velocità. Come accennato, il caricamento lento delle immagini è disponibile su Chrome dallo scorso anno, ma ora gli sviluppatori possono utilizzare lo stesso metodo anche sugli iframe. Per implementarlo sul tuo sito web, tutto ciò che devi fare è aggiungere
caricamento="pigro" attribuire alle tue immagini e/o elementi iframe. Browser come Firefox e Safari hanno già implementato la funzionalità di caricamento lento delle immagini native. Per quanto riguarda gli iframe, stanno ancora lavorando per correggere un paio di bug. Google ha anche menzionato che Chrome per Android in modalità Lite carica automaticamente immagini e iframe fuori schermo.Ironicamente, durante i test su come gli incorporamenti di video di YouTube (basati su iframe) influenzerebbero la velocità di caricamento della pagina web quando caricata in modo lento, il team di Chrome ha scoperto che "risparmiato 10 secondi su quanto presto le nostre pagine potrebbero essere interattive sui dispositivi mobili." Inutile dire che il lazy-loading presenta vantaggi reali rispetto al metodo tradizionale di scaricare l'intero contenuto della pagina web non appena la si visita.
Prezzo: gratuito.
4.1.
Fonte: web.dev
Attraverso: Techdows