Lazy načítání

Obrázky: `loading="lazy"` na všem kromě hero obrázku. Práh řeší prohlížeč a obvykle spouští načítání zhruba 1 000 px před vstupem do viewportu — kompromis mezi „načíst hned“ a „nestahovat, co nikdo neuvidí“.

Stránky: rozdělte bundle po stránkách, aby návštěva homepage nestahovala pokladnu. V Next.js to je výchozí chování pro routy; na klientovi to řeší `React.lazy` nebo `next/dynamic` u widgetů (graf, lightbox galerie, editor, chat).

Komponenty a data: obsah dialogu načítejte až na kliknutí, ne při načtení stránky. Často levná výhra je odložení skriptů třetích stran — chatovací bublina nebo consent lišta, které dobíhají až po prvním vykreslení.

Lazy načítání mění šířku pásma za latenci až ve chvíli potřeby. Galerie načítaná až na kliknutí ukáže prázdný lightbox na 300 ms, odložená routa blikne mezi stránkami. Když je nástroj malý a používá se pořád, je lepší načíst ho rovnou — knihovna ikon o 4 kB nemá cenu jednoho síťového kola.

Časté jsou dvě chyby. Lazy načítání LCP prvku posune LCP o celé jedno síťové kolo — to nedělejte nikdy. A lazy loading v horizontálním carouselu, který je vidět při načtení, nenačte nic, dokud uživatel neswipuje, což vypadá jako rozbité. Měřte: práh, který načítá příliš pozdě, se nedá odlišit od chyby.