Ako funguje lenivé načítanie?
Normálny HTML obrázok vyzerá takto:
<img src="sample.jpg" width="100%"/>Lazy loading plugins prepisujú kód takto:
<img data-src="sample.jpg" width="100%"/>Ako ste si všimli,srcatribút bol zmenený nadata-src.
Pretože niesrc, prehliadač pôvodne nenačíta tento obrázok. Neskôr malý kód JavaScript skontroluje, či je obrázok vo výreze (výrez používateľa) a či je vnútri,data-srcsa k tomu vraciasrcktorý prehliadač spustí sťahovanie a zobrazenie obrázka.
Čo je to natívne lenivé načítanie?
Prehliadač Chrome je dodávaný s „natívnym lenivým načítavaním“. Môžete si o tom prečítať tu.
Natívne lenivé načítavanie má tú výhodu, že nie je potrebný JavaScript a je vo všeobecnosti oveľa rýchlejšie, keďže to prehliadač robí „natívne“.
Kód vyzerá takto:
<img src="sample.jpg" loading="lazy" width="100%"/>Čo sú lietajúce obrázky?
Flying Images je vysoko výkonný doplnok na lenivé načítanie. Používa „natívne“ lenivé načítanie prehliadača, ak je k dispozícii, inak na pomalé načítanie použite bežný JavaScript.
Lietajúce obrázky môžu tiež načítať obrázky skôr, ako sa obrázky objavia vo výreze.
Bojíte sa lenivého načítania, pretože to poškodzuje používateľský zážitok?
Ako sa lietajúce obrázky líšia od iných doplnkov leného načítania?
- Používa vstavané lenivé načítanie - použite vstavané lenivé načítanie, ak je k dispozícii (momentálne podporované iba v prehliadači Chrome), inak použite JavaScript na pomalé načítanie obrázkov.
- Pred vstupom do výrezu načítajte obrázky - zatiaľ čo iné pluginy načítavajú obrázky, keď sú „vnútri“ výrezu, lietajúce obrázky ich načítavajú, keď sa chystajú vstúpiť do výrezu.
- Malý JavaScript - len 0,5 KB, komprimované, zmenšené.
- Ak chcete, môžete použiť iba natívne – chcete podporovať iba Chrome? Môžete prepnúť na možnosť „iba natívne“, ktorá nevkladá JavaScript.
- Prepíše všetok HTML kód - nikdy nezmeškáte obrázok kvôli lenivému načítaniu (aj keď je pridaný zásuvnými modulmi galérie).
- Priehľadná výplň - ku všetkým obrázkom je pridaná malá priehľadná základňa64. Už žiadne blikanie pri načítavaní obrázkov.
- Vylúčte kľúčové slová - Takmer všetky zásuvné moduly na pomalé načítanie poskytujú funkciu vylúčenia, avšak lietajúce obrázky môžu tiež vylúčiť obrázky z nadradeného uzla obrázka. Užitočné, ak váš obrázok nemá názov triedy.
- Podporuje prehliadače s vypnutým IE a JavaScriptom - všetky obrázky sa načítajú okamžite, ak je to Internet Explorer alebo aj keď je JavaScript úplne zakázaný (pomocou
noscripttag).
