A Google bejelenti a Web Vitals kezdeményezést, amely három alapvető mérőszám segítségével egységes útmutatást nyújt a fejlesztőknek a webhely teljesítményével kapcsolatban.
Visszatérve a tavalyi Chrome Developer Summit-re, a Google bejelentette az új Chrome fejlesztői eszközöket az oldalbetöltési idő csökkentése és a natív alkalmazásszerű élmény kialakítása. Akkoriban a vállalat megvitatta azt a kezdeményezést is, hogy egységes mérőszámkészletet biztosítson a fejlesztőknek, amelyekhez mérhető, amikor a felhasználói élményt és teljesítményt szem előtt tartva készítenek webhelyeket. Az eredeti ötlet nyomán a Google most bejelentette a Web Vitals kezdeményezést, amelynek célja, hogy biztosítsa "Egységes útmutatás a minőségi jelzésekhez, amelyek elengedhetetlenek a kiváló internetes felhasználói élmény biztosításához".
Az évek során a Google számos eszközt kínált a webhelyfejlesztőknek a webhely teljesítményének mérésére és jelentésére. Ide tartoznak például a világítótorony, Chrome DevTools
Az alapvető webes vitalértékek az összes weboldalra érvényes webes vitalértékek egy részhalmaza, amelyeket minden webhelytulajdonosnak mérnie kell, és minden Google-eszközben megjelenik. Jelenleg ezek a Core Web Vitals a felhasználói élmény három aspektusára összpontosítanak – a betöltésre, az interaktivitásra és a vizuális stabilitásra –, és a következő mutatókat (és a hozzájuk tartozó küszöbértékeket) tartalmazzák:
- Legnagyobb tartalmat tartalmazó festék (LCP): terhelési teljesítményt mér. A jó felhasználói élmény érdekében az LCP-nek 2,5 másodpercen belül meg kell történnie az oldal első betöltésének megkezdése után.
- Első beviteli késleltetés (FID): interaktivitást mér. A jó felhasználói élmény érdekében az oldalak FID-jének 100 ezredmásodpercnél rövidebbnek kell lennie.
- Kumulatív elrendezéseltolás (CLS): a látás stabilitását méri. A jó felhasználói élmény érdekében az oldalaknak 0,1-nél kisebb CLS-t kell fenntartaniuk
Annak érdekében, hogy segítse a fejlesztőket ezen alapvető webes vital értékek mérésében és jelentésében, a Google elkötelezett amellett, hogy ezeket a mutatókat megjelenítse eszközeiben. A következő diagram részletezi, hogy mely eszközök támogatják a Core Web Vitalokat:
A fejlesztők képesek lesznek mérni minden egyes Core Web Vital elemet JavaScriptben szabványos webes API-k segítségével, és minden egyes Core Web Vitalról jelentést készíthetnek anélkül, hogy kódot írnának, a Web Vitals Chrome-bővítmény. A bővítmény a web-vitals könyvtár segítségével méri ezeket a mutatókat, és megjeleníti azokat a felhasználók számára, amikor az interneten böngészik. A bővítmény hasznos lehet webhelyei, versenytársai webhelyei és általában az internet teljesítményének megértésében is. Alternatív megoldásként azok a fejlesztők, akik szívesebben mérnék ezeket a mutatókat a mögöttes webes API-k segítségével, a megvalósítás részleteiért tekinthetik meg a mérőszámok útmutatóit az alábbi hivatkozással ellátott webhelyen.
A Core Web Vitals mellett a Google más Web Vitals-okról is beszél, amelyek proxyként vagy kiegészítő mérőszámként szolgálnak a Core Vitals számára. Ide tartoznak az olyan mutatók, mint az első bájtig eltelt idő (TTFB), az első tartalmas festés (FCP), a teljes blokkolási idő (TBT) és az idő az Interactive (TTI), amely segíthet a fejlesztőknek a tapasztalatok nagyobb részének megszerzésében, vagy segíthet a konkrét diagnosztizálásban problémák.
Érdemes megjegyezni, hogy ezek a Web Vitals és Core Web Vitals idővel fejlődni fognak, és a fejlesztőknek számítaniuk kell a lista jövőbeni fejlesztéseire vagy kiegészítésére. Mivel azonban a Core Web Vitals minden weboldalra vonatkozik, és számos Google-eszközben szerepel, ezeknek a mutatóknak a módosítása nem módosítja azok meghatározását és küszöbértékeit. A fejlesztők előzetes értesítést kapnak a közelgő változásokról és a kiszámítható éves ütemről is. Tekintettel arra, hogy a többi Web Vital kontextus- vagy eszközspecifikus, definícióik és küszöbértékeik gyakrabban változhatnak előzetes értesítés nélkül. Az összes Web Vital-on végrehajtott változtatásokat ebben dokumentáljuk nyilvános változásnapló.
Forrás: web.dev