Core Web Vitals parandamine WordPressis ja WooCommerce’is

Google Search Console või PageSpeed Insights näitab, et leht ei läbi Core Web Vitals hindamist: LCP on liiga pikk, leht hüppab laadimise ajal või nupule vajutamine reageerib viitega. Üldine „kiirendamine“ ei pruugi seda lahendada, sest iga mõõdik tuleb konkreetsest põhjusest. See töö on kitsam ja diagnostilisem kui üldine kiiruse optimeerimine: võtame ette just need kolm mõõdikut ja selle, mis neid raskendab.

Eesmärk on, et sinu päris külastajate andmed (CrUX) jõuaks „good“ piirideni: LCP kuni 2,5 s, INP kuni 200 ms ja CLS kuni 0,1, mõõdetuna 75. protsentiilil. Laboriskoori ilusaks tegemine ei ole eesmärk iseenesest.

Mida töö sisaldab

• Diagnoos. Võrdleme välja- ja laborandmeid: PageSpeed Insights, CrUX, Search Console’i Core Web Vitals raport, Lighthouse ning Chrome DevToolsi Performance paneel. Eristame mobiili ja arvuti ning kõige halvemaid lehetüüpe (avaleht, toote- ja kategoorialeht, ostukorv).
• LCP: suurim sisuelement. Tuvastame, mis on igal lehel LCP-element, ja parandame selle laadimisteekonna: õige pildisuurus ja formaat, preload, fetchpriority="high", lazy-load’i eemaldamine esimeselt pildilt ning serveri vastuseaja ja vahemälu.
• Renderdamist blokeerivad CSS ja JS. Kriitilise CSS-i eraldamine, kasutamata CSS-i vähendamine ning skriptide edasilükkamine (defer) seal, kus see ei lõhu funktsionaalsust.
• Fondid. Fontide laadimine ilma nähtamatu teksti perioodita, font-display, fontide eellaadimine ja vajadusel omaserverist teenindamine ning alamhulga (subset) kasutamine.
• CLS: layout shift. Piltidele ja videotele mõõtmed, bännerite, küpsisenoti ja reklaamide jaoks reserveeritud ruum, fontide asendusest tulenevad hüpped ja hiljem sisse laaditavad plokid.
• Kolmanda osapoole skriptid. Vaatame üle jälgimis-, vestlus- ja turunduskoodid ning lükkame mittekriitilised edasi kasutaja tegevuseni või lehe laadimise lõpuni.
• INP: reageerimine. Leiame pikad ülesanded (long tasks) ja raskeid sündmusekäsitlejaid, mis blokeerivad peaharu, ning vähendame JavaScripti hulka, näiteks menüüs, filtrites ja ostukorvis.
• Enne ja pärast. Mõõdame samade lehtede tulemused enne ja pärast ning dokumenteerime muudatused, et järgmine arendaja neid tagasi ei võta.

Tüüpilised põhjused

LCP-d venitab tihti avalehe suur slaider või taustapilt, mis laeb alles pärast JavaScripti käivitumist, või esimene pilt, millele on lazy-load kogemata peale pandud. CLS-i tekitavad enamasti mõõtmeteta pildid, hiljem ilmuv küpsisebänner ja fondivahetus. INP-d rikuvad raskeks läinud lehe-ehitaja skriptid, ostukorvi fragmentide uuendamine ja kolmanda osapoole vestlusaknad. Iga põhjus nõuab oma parandust, seepärast alustame alati diagnoosist.

Mida me sinult vajame

• WordPressi administraatori ja hosti ligipääs, vajadusel ka Search Console’i vaatamisõigus.
• Info lehe skriptide kohta: millised jälgimiskoodid, vestlused ja reklaamid on tegelikult vajalikud.
• Otsus, kui mõni plugin või teema vajab kompromissi, näiteks ilusa slaidiri asendamine kiirema lahendusega.

Mis jääb tööst välja

• Kogu saidi üldine kiirendamine, serveri vahetus ja andmebaasi puhastus: selleks vaata WordPressi kiiruse optimeerimist.
• Tehnilise skoori garantii. Päris kasutajate andmed uuenevad CrUX-is umbes 28 päeva jooksul, seega tulemus ilmub Search Console’i viivitusega.
• Teema või lehe täielik ümberehitus. Kui probleem on teema ülesehituses, soovitame uuele teemale üleminekut.
• Analüütika- ja sildihalduse seadistus, vt GA4 ja Tag Manager.

Kellele see sobib

Sobib lehtedele, mille Search Console näitab „Poor“ või „Needs improvement“ URL-e, e-poodidele, kus aeglane toote- või ostukorvileht maksab müüki, ning lehtedele, mis on juba kiirenduspluginaga proovinud, aga tulemus jäi samaks. Kui kogu sait on lihtsalt aeglane, alusta üldisest kiirusest.