Miten laiska lataus toimii?
Normaali HTML-kuva näyttää tältä:
<img src="sample.jpg" width="100%"/>Laiskot latausliitännäiset kirjoittavat koodin uudelleen seuraavasti:
<img data-src="sample.jpg" width="100%"/>Kuten huomasit,srcattribuutti on muutettu muotoondata-src.
Koska eisrc, selain ei lataa tätä kuvaa aluksi. Myöhemmin pieni JavaScript-koodi tarkistaa, onko kuva katseluportissa (käyttäjän katseluportissa) ja onko se sisällä,data-srcpalaa siihensrcmikä selain käynnistää kuvan lataamisen ja näyttämisen.
Mikä on natiivi laiska lataus?
Chromessa on "alkuperäinen laiska lataus". Voit lukea siitä täältä.
Alkuperäisellä laiskalatauksella on se etu, että JavaScriptiä ei tarvita ja se on yleensä paljon nopeampaa, koska selain tekee sen "natiivisti".
Koodi näyttää tältä:
<img src="sample.jpg" loading="lazy" width="100%"/>Mitä lentävät kuvat ovat?
Flying Images on tehokas laiskalatauslaajennus. Se käyttää selaimen "alkuperäistä" laiskalatausta, jos se on saatavilla, muuten käytä tavallista JavaScriptiä laiskalataukseen.
Lentävät kuvat voivat myös ladata kuvia ennen kuin kuvat edes ilmestyvät katseluporttiin.
Pelkäätkö laiska latausta, koska se vahingoittaa käyttökokemusta?
Miten lentävät kuvat eroavat muista laiskalatauslaajennuksista?
- Käyttää sisäänrakennettua laiskalatausta - käytä sisäänrakennettua laiskalatausta, jos se on käytettävissä (tällä hetkellä tuettu vain Chromessa), muussa tapauksessa käytä JavaScriptiä kuvien laiskaan lataamiseen.
- Lataa kuvat ennen katseluporttiin siirtymistä - kun muut laajennukset lataavat kuvia, kun ne ovat "sisällä", lentävät kuvat lataavat ne, kun ne ovat tulossa katseluporttiin.
- Pieni JavaScript - vain 0,5 kt, pakattu, pienennetty.
- Halutessasi voit käyttää vain alkuperäistä – haluatko tukea vain Chromea? Voit vaihtaa "vain alkuperäiseen" käyttöön, joka ei lisää JavaScriptiä.
- Kirjoittaa uudelleen kaiken HTML-koodin - Älä koskaan missaa kuvaa laiskan latauksen vuoksi (vaikka se olisi lisätty gallerialaajennuksilla).
- Läpinäkyvä täyteaine - kaikkiin kuviin on lisätty pieni läpinäkyvä pohja64. Ei enää välkkymistä kuvia ladattaessa.
- Sulje avainsanat pois - Melkein kaikki laiskalatauslaajennukset tarjoavat poissulkemisominaisuuden, mutta lentävät kuvat voivat myös sulkea kuvia pois kuvan yläsolmusta. Hyödyllinen, jos kuvallasi ei ole luokan nimeä.
- Tukee selaimia, joissa IE ja JavaScript eivät ole käytössä - kaikki kuvat ladataan välittömästi, jos se on Internet Explorer tai vaikka JavaScript on kokonaan poistettu käytöstä (käyttäen
noscripttag).
