Líné načítání
Líné načítání je technika, která odkládá načítání nekritických prostředků, jako jsou obrázky pod okrajem obrazovky, dokud nejsou skutečně potřeba, což zlepšuje rychlost počátečního načtení stránky.
Lazy loading je strategie optimalizace výkonu, která odkládá načítání prostředků do doby, kdy jsou potřeba. Místo načtení každého obrázku, videa a skriptu při prvním otevření stránky lazy loading načte pouze prostředky viditelné v počátečním viewportu a zbytek stáhne, jak uživatel posouvá stránku dolů. Nejčastějším využitím je lazy loading obrázků.
Bez lazy loadingu by prohlížeč stáhl všech 50 obrázků okamžitě, což plýtvá šířkou pásma a zpomaluje počáteční vykreslení. S lazy loadingem se nejprve načtou pouze viditelné obrázky a zbytek se načte, jak k nim uživatel posouvá stránku. Moderní prohlížeče nativně podporují lazy loading pomocí atributu loading="lazy" u elementů img a iframe.
V praxi
- Fotografické portfolio s 200 obrázky na stránku snížilo dobu počátečního načtení z 12 sekund na 1,8 sekundy díky lazy loadingu všech obrázků pod prvními třemi řadami
- Stránka kategorie e-shopu se 60 produktovými obrázky nasadila nativní lazy loading, čímž snížila počáteční velikost stránky z 8 MB na 800 kB
- Zpravodajský web používá lazy loading u vložených videí z YouTube a nahrazuje je odlehčenými náhledy, dokud uživatel neklikne na přehrání, což ušetří 1,5 MB JavaScriptu na video
- Stránka s dlouhým článkem používá lazy loading u widgetů se souvisejícími články a sekcí komentářů dole, čímž upřednostňuje obsah článku pro co nejrychlejší počáteční vykreslení
Nejste si jistí, jak se to týká vás?
Zkušený inženýr projde váš web, vaši viditelnost ve vyhledávání a způsob, jakým se k vám dostávají poptávky, a poté sepíše tři věci, které je vhodné opravit jako první. Dokument si ponecháte tak jako tak.
