Egy gyors weboldal betöltése szemvillanásnak tűnik, pedig a háttérben egy pontosan koreografált lánc fut le. Ha érted a lépéseket, azt is látni fogod, hol veszít a legtöbb oldal értékes másodperceket.
1. DNS: a telefonkönyv
A böngésző megkérdezi, melyik szerver IP-címe tartozik a domainhez. Ha a válasz már a gyorsítótárban van, ez szinte azonnali; ha nincs, néhány tucat ezredmásodperc.
2. Kapcsolat és titkosítás
Létrejön a kapcsolat, majd a TLS-kézfogás során a böngésző és a szerver megegyezik a titkosításban – ettől lesz https. A modern TLS 1.3-nak ehhez már egyetlen oda-vissza üzenetváltás is elég.
3. Kérés és válasz
A böngésző elkéri az oldalt. Ha a weboldal CDN-en fut, a válasz egy hozzád közeli szerverről érkezik (például Budapestről vagy Frankfurtból), nem a világ túloldaláról. Az első bájt megérkezéséig eltelt idő a TTFB.
4. Építkezés
Megjön a HTML, a böngésző elkezdi feldolgozni, és közben felfedezi, mi kell még: CSS, betűtípusok, képek, JavaScript. A HTTP/2 és a HTTP/3 ezeket párhuzamosan tölti le.
5. Festés
A böngésző kiszámolja az elrendezést, és kirajzolja a képernyőt. Amikor a legnagyobb elem (gyakran egy kép vagy a főcím) megjelenik, az az LCP – a „kész az oldal” érzés.
6. Életre kel
Lefut a JavaScript, és az oldal reagálni kezd a kattintásokra. Ha túl sok a szkript, a gombok lomhák lesznek – ezt méri az INP.
Hol vész el a legtöbb idő?
- Túl nagy, rossz formátumú képek (használj AVIF-et vagy WebP-t, a megjelenített mérethez igazítva).
- Túl sok betűtípus és betűvastagság.
- Külső szkriptek: csevegőablakok, követőkódok, beágyazások.
- Lassú, olcsó tárhely, gyorsítótár és CDN nélkül.
Mérd le a saját oldaladat a PageSpeed Insightsban (pagespeed.web.dev), mobil nézetben – ha a szám piros, szívesen megmutatom, mit javítanék először.