Etter å ha lagt til den innfødte lazy loading-funksjonen til Chrome i fjor, lar Google nå utviklere laste tunge iframes. Les videre for å vite mer!
Økningen av netttrafikk fra mobilbrukere og mennesker over hele verden med begrensede tilkoblingsmuligheter presset selskapene og utviklerne til å optimalisere lastehastighetene til nettstedet kraftig. Tradisjonelt, når du navigerer til en nettside, laster den ned og viser alt tilgjengelig innhold: bilder, ikoner, GIF-er, stiler, skript og så videre. Som du kan forestille deg, forårsaker lasting av alt dette en forsinkelse når nettstedet starter opp, spesielt for brukere med trege tilkoblinger. Google har prøvd å eliminere dette problemet en stund. Bare i fjor, la de til funksjon for lazy-lasting av bilder i Google Chrome 76. Nå bringer Google den samme funksjonaliteten til iframes.
Lazy loading laster inn innholdet på nettsiden på forespørsel, noe som betyr at de ikke vil bli lastet ned og vises til du blar ned og får dem i visningen, og reduserer dermed den første oppstarten av nettstedet hastighet. Som nevnt har den late innlastingen av bilder vært tilgjengelig på Chrome siden i fjor, men nå kan utviklere bruke samme metode på iframes også. For å implementere det på din egen nettside, er alt du trenger å gjøre å legge til
loading="lat" attributt til bildene og/eller iframe-elementene dine. Nettlesere som Firefox og Safari har allerede implementert funksjonen for lat innlasting av bilder. Når det gjelder iframes, jobber de fortsatt med å fikse et par feil. Google nevnte også at Chrome for Android i Lite-modus automatisk laster inn bilder utenfor skjermen og iframes.Ironisk nok, under testingen av hvordan YouTube-videoinnbygging (som er iframe-basert) ville påvirke nettsidens lastehastighet når den ble lastet lat, fant Chrome-teamet ut at de "spart 10 sekunder av hvor raskt sidene våre kan være interaktive på mobile enheter."Det er unødvendig å si at lat-lasting har reelle fordeler i forhold til den tradisjonelle metoden for å laste ned hele innholdet på nettsiden så snart du besøker den.
Pris: Gratis.
4.1.
Kilde: web.dev
Via: Techdows