A gyors weboldal nem trükk, hanem döntések sorozata

Egy weboldal sebessége nem utólag ráaggatott optimalizáció. A végeredmény azon múlik, mit döntöttetek a képekről, a betűtípusokról, a szkriptekről és a renderelésről — jóval az élesítés előtt.

A három mutató, ami számít

• LCP (legnagyobb tartalmi elem betöltése): a cél 2,5 másodperc alatt. Ezt szinte mindig a hero kép vagy egy blokkoló betűtípus rontja el.
• INP (interakcióra adott válasz): 200 ezredmásodperc alatt. Itt a túl sok JavaScript a bűnös.
• CLS (elrendezés-elcsúszás): 0,1 alatt. Fix méretek a képeknek és a hirdetési helyeknek.

Amit tudatosan kihagyunk

Nem teszünk az oldalra hat különböző követőszkriptet, nem töltünk be öt betűtípus-változatot, és nem használunk olyan animációs könyvtárat, ami önmagában 90 kB. Minden extra kilobyte-nak indokolnia kell magát: mit ad az üzletnek?

Amit mindig megcsinálunk

1. Modern képformátum (AVIF/WebP), méretre vágva, lusta betöltéssel a hajtás alatt.
2. Kritikus CSS előre, a többi késleltetve.
3. Szerveroldali renderelés vagy statikus generálás, ahol az tartalmi oldal.
4. Betűtípus font-display: swap értékkel és előtöltéssel.
5. CDN és megfelelő gyorsítótár-fejlécek.

Miért üzleti kérdés

A Google és több e-kereskedelmi kutatás egybehangzó eredménye: minden extra másodperc mérhető konverzióveszteség, mobilon különösen. A sebesség tehát nem fejlesztői hiúság, hanem a marketingköltés hatékonyságának szorzója. Egy lassú oldalra vitt fizetett forgalom egy részét egyszerűen kidobjátok.

Ezért minden projektünk végén teljesítménybüdzsé kerül a dokumentációba: mekkora lehet az oldal, hány kérést indíthat, és mi az a küszöb, ami alatt nem élesítünk.