Optimizarea performanței web în 2024: tendințe și previziuni

Publicat: 2023-12-16

Într-o zi, răsfoim aproximativ 130 de pagini web, așteptând aproximativ 6 secunde să se încarce fiecare.

Aceasta înseamnă că petreci 13 minute uluitoare trecând peste un ecran în mod inactiv în fiecare zi – și peste 17 minute dacă ești pe telefon.

Joc cu dinozauri Chrome

Nu este surprinzător faptul că optimizarea performanței web (WPO) continuă să împingă limitele în căutarea unor modalități mai bune de a recâștiga o parte din timpul pierdut. Sau măcar asigurați-vă că așteptăm cât mai puțin posibil.

Să parcurgem cele mai notabile realizări din ultimele 12 luni și să ne pregătim să valorificăm tendințele subtile pe care le vedem venind în 2024!

Web-ul mai rapid: unde suntem acum?

Numai în 2023, performanța web-ului a suferit o evoluție substanțială, evidențiată în special de progresele impresionante ale Core Web Vitals (CWV).

Valorile care reprezintă viteza de încărcare, capacitatea de răspuns la interacțiune și stabilitatea aspectului au stabilit noi repere pentru performanța site-ului.

Core Web Vitals

O adevărată dovadă a acestui progres este uimitor de 10.000 de ani de timp de așteptare economisiți – o realizare monumentală care decurge din îmbunătățirile aduse Core Web Vitals.

Această reducere masivă a timpului de așteptare se întinde pe platformele desktop și mobile, evidențiind impactul substanțial pe care l-au avut aceste îmbunătățiri asupra experienței utilizatorilor pe întregul web.

Chrome a salvat 10.000 de ani

Mai mult, datele din HTTP Archive vorbesc multe despre adoptarea și implementarea în creștere a Core Web Vitals.

Site-urile web care au trecut de evaluarea Core Web Vitals au înregistrat o creștere semnificativă, reflectând o creștere de 6% numai în 2023 . Acest salt semnalează un efort colectiv din partea dezvoltatorilor web, a proprietarilor de site-uri și a produselor din întreaga lume de a prioritiza și optimiza site-urile lor pentru o experiență de navigare mai fluidă, mai rapidă și mai ușor de utilizat pentru toți.

Rezultatele Core Web Vitals

În prezent, există peste 6,5 milioane de origini eligibile în Raportul despre experiența utilizatorului Chrome (CrUX).


Starea elementelor vitale web de bază: retrospectivă și realizări

La începutul anului 2023, 41,8% dintre site-uri web au trecut Core Web Vitals. De atunci, am observat o creștere constantă, unde ratele de promovare pentru desktop au crescut la 47,4%.

Cum au fost obținute aceste rezultate spectaculoase? Să vedem ce evoluții au introdus Chrome și ecosistemul mai larg.

Evoluții Google Chrome

Progresele majore au venit direct de la echipa de dezvoltare Google Chrome:

  • Probabil, cea mai mare știre din Core Web Vitals pentru 2023 este lansarea oficială a noii valori de răspuns – Interacțiunea cu Next Paint (INP) . INP urmează să înlocuiască FID în martie 2024, ca o modalitate mai cuprinzătoare de a măsura toate interacțiunile din timpul unei sesiuni, în loc de doar prima, ca predecesorul său.
  • Introducerea memoriei cache înapoi/înainte (bfcache) în browserul Chrome: concepută pentru a vă ajuta să mergeți înapoi sau înainte în istoricul de navigare fără a aștepta reîncărcarea paginii.

Rezultate: rata de accesare a BFCache s-a îmbunătățit de la o lună la lună atât pe Android (3,6%), cât și pe desktop (1,8%)

  • Noua caracteristică PreconnectOnAnchorInteraction care se conectează la origini cu pointer-ul în jos, mai degrabă decât cu pointer în sus.

Rezultate: a condus la o îmbunătățire medie a LCP de 6/10 ms (0,4/1%) pe Android/Desktop și la o îmbunătățire a LCP cu origini încrucișate cu ~60 ms atât pe Android, cât și pe desktop. Lansarea a dus, de asemenea, la o creștere cu 0,08% a veniturilor din anunțurile de conținut.

  • Pre-rendarea paginilor astfel încât acestea să se încarce instantaneu înainte ca utilizatorul să le viziteze efectiv.

Rezultate: Încărcările paginilor prin introducerea adreselor URL direct în caseta polivalentă au primit o îmbunătățire mediană a LCP de 500-700 ms (14-25%) cu redarea preliminară, deplasând LCP median global în toate navigațiile cu 6,4 ms.

  • Lansarea limitării filelor pentru filele de fundal care rulează la EcoQOS pe Windows 11 și Ajustările rolului sarcinilor și QoS pe macOS pentru a păstra filele de fundal în afara drumului dvs.

Rezultate: a condus la îmbunătățiri în cea mai mare vopsea cu conținut maxim (LCP) și interacțiune cu următoarea vopsea (INP)

  • Optimizări continue pentru Chrome în mai multe file active

Rezultate: S -au observat îmbunătățiri ale programării și ale conflictului, care au îmbunătățit INP cu 5% și LCP cu 2% în ultimele 6 luni.

  • Îmbunătățiri ale sistemului de redare Chrome care modifică prioritatea cozilor de activități pentru CWV optim, cum ar fi încărcarea cu prioritate ridicată a imaginilor, compunerea prioritizată după întârziere și optimizările rasterului SVG. Toate îmbunătățirile au avut ca rezultat creșterea ratei de promovare a LCP, CLS și INP.

Realizări WordPress și Core Web Vitals

În 2023, sub eforturile dedicate ale echipei Core Performance și ale colaboratorilor, WordPress a făcut salturi substanțiale în îmbunătățirea ratelor de promovare Core Web Vitals.

8,25% pentru desktop și 8,13% pentru mobil, mai exact.

Rata de promovare CWV WordPress

Unul dintre obiectivele principale din foaia de parcurs pentru anul a fost acela de a oferi proprietarilor de site-uri posibilitatea de a trece cea mai dificilă măsură CWV în WP core – LCP.

Multe îmbunătățiri ale nucleului se concentrează pe îmbunătățirea timpului de răspuns al serverului, rularea unor baze de date mai eficiente, îmbunătățirea livrării JS și CSS și optimizarea imaginilor:

  • Identificarea și abordarea celor mai mari blocaje legate de timpul de răspuns al serverului din nucleul WordPress
  • Îmbunătățirea performanței PHP a temelor bloc
  • Sprijinirea Gutenberg Faza 3 cu îndrumări, îmbunătățiri și revizuiri axate pe performanță
  • Încărcarea automată a claselor PHP WordPress
  • Explorarea modalităților de îmbunătățire a performanței traducerilor
  • Integrarea bazei de date SQLite
  • Optimizarea interogării bazei de date de opțiuni încărcate automat în miezul WordPress
  • Explorarea modalităților de a îmbunătăți și mai mult performanța interogărilor bazei de date
  • Îmbunătățirea API-ului Scripts cu o strategie de încărcare
  • Eliminarea utilizării jQuery de pe front-end în temele implicite WordPress
  • Adăugarea fetchpriority="high" la imaginea LCP în miezul WordPress
  • Evitarea încărcării leneșe a imaginilor LCP/erou în nucleul WordPress
  • Îmbunătățirea calculului atributelor dimensiunilor imaginii

Rezultatele?

WordPress 6.3 se încarcă cu 27% mai rapid pentru temele bloc și cu 18% mai rapid pentru temele clasice, comparativ cu WordPress 6.2, pe baza valorii LCP (Larest Contentful Paint).

Defalcând și mai mult, vedem o îmbunătățire definitivă a tuturor valorilor Core Web Vitals pe WordPress mobil:

  • 43,37% trec LCP
  • 78,98% trec CLS
  • Și 97,42% trec FID

WordPress core web vitals mobil

Ca o soluție care ajută cei peste 180.000 de proprietari de site-uri WordPress să obțină o experiență excelentă pentru utilizator, noi, cei de la NitroPack, suntem mândri că am contribuit la îmbunătățirea CWV pe platformă. Preradând link-uri prin API-ul regulilor de speculație, am observat o îmbunătățire cu 80% a LCP și o îmbunătățire cu 55% a INP în paginile preradate în comparație cu cele fără încărcare speculativă.

Comunitate JavaScript pentru Better Core Web Vitals

Ca parte a proiectului Chrome Aurora, în care Chrome și cadrele web open-source colaborează, am observat parteneriate de succes cu Next.js, Angular și Nuxt în lansarea unor funcții axate pe performanță precum:

  • componenta următoare/script
  • NgOptimizedImage
  • nuxt/google-fonts

În 2022, Next.js raportează că ratele de promovare au crescut de la 20,4% la 27,3%. Ratele de promovare unghiulară au crescut de la 7,6% la 13,2%, iar ratele de promovare Nuxt au crescut de la 15,8% la 20,2%.

În viața reală, aceste noi funcții s-au tradus în îmbunătățiri notabile Core Web Vitals pentru companii precum Land's End și CareerKarma.

După ce a trecut la NgOptimizedImage, Land's End a susținut o îmbunătățire cu 40% a LCP pe mobil în testele de laborator Lighthouse și o îmbunătățire cu 75% a LCP pe desktop. LCP-ul CareerKarma, pe de altă parte, a fost redus cu 24% la trecerea la modul de lucru web al scriptului următor.

„Prin prezenta, proclam 2024 anul Componentelor Web! Componente Web de dimensiune octet, fără dependențe, opționale pentru JavaScript, agnostice de cadru, redate de server.”

— Stoyan Stefanov, Creatorul perfplanet.com, ex-Yahoo, Publicat JS Autor

SEO/SEA și Core Web Vitals: Puncte de contact

Importanța Core Web Vitals în relație cu SEO (Search Engine Optimization) a fost mult timp discutată.

În urma actualizărilor din aprilie ale ghidurilor privind experiența paginii, un răspuns definitiv este că Core Web Vitals nu reprezintă un factor singular de clasare, ci mai degrabă o parte a unui sistem care contribuie la evaluările experienței paginii.

„Legătura dintre Core Web Vitals și performanța în SEO este încă aprins dezbătută, mulți oameni sugerând că rareori este ceva care va afecta direct clasamentele. Dar mă bucur să spun că văd tot mai multe organizații care prioritizează îmbunătățirea vitezei, indiferent. Un site mai rapid înseamnă utilizatori mai fericiți, frecare redusă, acreditări ecologice mai bune și venituri mai mari.”

— Jono Alderson, expert SEO de top la nivel mondial (fost șef SEO @Yoast)

Este important de reținut că relevanța rămâne factorul decisiv atunci când se clasifică o pagină, așa cum a explicat John Muller (Google Search Advocate) :

„Dacă site-ul A este mai rapid decât site-ul B, dar B este mai relevant pentru interogarea utilizatorului de căutare, site-ul B ar depăși în continuare A.”
Într-un thread de Twitter, el a subliniat, de asemenea, că „...Core Web Vitals este mai mult decât un factor de clasare aleatoriu, este, de asemenea, ceva care afectează capacitatea de utilizare a site-ului tău după ce acesta se clasează (când oamenii îl vizitează de fapt).”

În timpul prezentării sale la evenimentul Google I/O Extended din Sydney, în iunie 2023, Tamas Piros a confirmat, de asemenea, importanța Core Web Vitals, spunând „... dacă site-ul tău se încarcă lent, asta va avea un impact negativ asupra căutării tale. rezultatele clasamentului paginii.”

În ceea ce privește SEA (Search Engine Advertising) , experiența utilizatorului se corelează direct cu scorul de calitate al anunțurilor dvs. Exemplele din lumea reală includ:

  • Unul dintre clienții Lever Interactive și-a crescut Scorul de calitate, ducând la -17% CPC și -31% CPA, ceea ce a însemnat și o creștere cu 20% a ratelor de conversie pe paginile de destinație mai rapide;
  • Un scor de calitate ridicat înseamnă, de asemenea, obținerea unei reduceri de până la 50% la prețurile dvs. CPC și optimizarea instantanee a bugetelor pentru anunțuri;
  • Netzwelt a observat că veniturile din publicitate au crescut cu 18%, vizibilitatea anunțurilor a crescut cu peste 75%, ratele de respingere au scăzut cu 50% și vizionările de pagini au crescut cu 27% prin optimizarea pentru Core Web Vitals.
  • În 2023, paginile care îndeplinesc toate cerințele Google sunt clasate cu 1 punct procentual mai mult decât media. În timp ce domeniile mai lente se vor clasa cu 3,7 puncte procentuale mai jos decât cele rapide.

Citat de Jono Anderson

Business Web Vitals: Impactul optimizării performanței web asupra rezultatului final

În 2023, companiile au continuat să adopte optimizarea Core Web Vitals pentru a-și ridica profitul, unde o îmbunătățire cu 0,1 secunde a timpului de încărcare înseamnă:

  • Cu până la 8,6% mai multe pagini vizualizate într-o sesiune
  • Îmbunătățirea cu 5,2% a implicării clienților
  • Cu 8,4% mai multe conversii
  • Creștere cu 9,2% a valorii medii a comenzii (AOV)

Îmbunătățiri ale vitezei de călătorie ale cumpărătorului

Cel mai recent studiu de caz WPO arată rezultatele lui Carpe după optimizarea site-ului web pentru o experiență mai bună a utilizatorului – îmbunătățire cu 52% în cea mai mare vopsea de conținut și cu 41% în schimbare cumulativă a aspectului, o creștere cu 10% a traficului, o creștere cu 5% a ratei de conversie a magazinului online, și o creștere cu 15% a veniturilor.

În timpul unui webinar cu Google despre „Core Web Vitals for Your Business”, în septembrie 2023, NitroPack a împărtășit învățăminte din studiile interne care leagă experiența și viteza utilizatorului cu modele specifice de comportament ale utilizatorilor:

  • Utilizatorii care au avut un timp de încărcare de 3 secunde sau mai puțin au vizitat cu 60% mai multe pagini.

Afișări de pagină pe cercetare de sesiune

  • Cu 50% mai mulți vizitatori abandonează atunci când o pagină se încarcă în 3 secunde, în comparație cu un timp de încărcare a paginii de 2 secunde.

Cercetarea timpului de încărcare a ratei de scădere

  • Vizitatorii își pierd răbdarea și încep să abandoneze o pagină web în mod disproporționat la 2,75 secunde din încărcarea paginii

Indicele de răbdare a vizitatorilor nitropack

Vedem că mai multe companii trec de la ideea de viteză ca obiectiv final și mai mult către îmbunătățirea modului în care utilizatorii interacționează cu site-urile lor web. Abordarea problemelor Core Web Vitals depășește cu mult repararea backend-ului. De fapt, și-a găsit un loc binemeritat printre KPI-urile de afaceri, precum și în rapoartele de creștere.

Web-ul mai rapid în 2024: predicții

„Pe lângă continuarea tendinței existente de îmbunătățire pentru Core Web Vitals, chiar cred că 2024 ar putea fi anul „web-ului instantaneu”, cu API-ul Chrome Speculation Rules ajungând la curentul principal și făcând pre-rendarea o adăugare ușoară pentru multe site-uri. Acest lucru va permite experiențe mai simple, în special cuplate cu API-ul View Transitions cu mai multe pagini.”

— Barry Pollard, Avocat pentru dezvoltatori de performanță web @Google Chrome

Să vedem ce tendințe vor modela anul 2024 nu numai mai rapid, ci și aproape instantaneu.

Trecerea LCP: concentrarea pe optimizările potrivite

56,4%

Acesta este câte site-uri web trec LCP pe mobil, comparativ cu 94,2% pentru FID și 77,2% pentru CLS. Natura provocatoare a metricii LCP provine din complexitatea timpului petrecut în încărcarea celui mai mare element de conținut.

În 2022, Philip Walton a propus o nouă modalitate de a descompune de data aceasta:

  • Timpul pentru a începe să primiți conținut pe client (TTFB)
  • Timpul pentru a începe încărcarea imaginii LCP (întârziere de încărcare a resurselor)
  • Timpul până la finalizarea încărcării imaginii LCP (timp de încărcare a resurselor)
  • Timpul până când elementul LCP este randat (întârziere de randare a elementului).

Acest lucru permite măsurarea granulară și îi ajută pe proprietarii de site-uri să identifice blocajele, precum și care optimizări ar fi cele mai eficiente pentru a îmbunătăți scorul LCP. În noiembrie 2023, Estela Franco a împărtășit rezultatele cercetării în milisecunde.

Problema? Întârziere de încărcare a resurselor.

Cercetarea defalcării scorului LCP

Aceasta înseamnă că trebuie să ne concentrăm pe încărcarea celei mai mari resurse de conținut mai devreme decât pe optimizarea duratei de încărcare.

✦ Noi prezicem...

În 2024, dezvoltatorii și proprietarii de site-uri deopotrivă se vor concentra pe îmbunătățirea posibilității de descoperire a elementului LCP prin indicii de resurse și pe excluderea acestuia de la încărcare leneră.

Citat Barry Pollard


Pregătirea pentru INP: noua măsurătoare de receptivitate

Mulți au speculat deja dacă apusul valorii FID va avea sau nu un impact mare asupra ratelor de trecere CWV.

Raspunsul este da.

Web Almanah INP vs FID

Ratele de promovare vor scădea odată ce INP va începe (în special pe mobil), iar dezvoltatorii vor trebui să-și sufle mânecile pentru a se asigura că evaluările lor CWV rămân verzi.

INP, cu toate acestea, este un mare pas înainte în înțelegerea modului în care utilizatorii interacționează cu site-urile noastre web. Deoarece măsoară toate interacțiunile din timpul unei sesiuni, proprietarii de site-uri vor obține mai multe informații despre unde au loc cele mai multe întârzieri.


✦ Noi prezicem...

În 2024, dezvoltatorii vor folosi din ce în ce mai mult API-urile Scheduler.yield() și Cadre de animație lungi pentru a întrerupe și a reduce sarcinile lungi, astfel încât firul principal să fie gata să accepte o interacțiune fără întârzieri.

Citat Barry Pollard iNP


O mai bună înțelegere a performanței site-ului

Odată cu sofisticarea optimizării performanței web, vine necesitatea unei înțelegeri îmbunătățite a ceea ce înseamnă aceasta de fapt pentru proprietarii de site-uri.

În 2023, am observat o curiozitate în creștere în ceea ce privește modul în care Core Web Vitals se potrivesc în contextul mai măreț al afacerii în ansamblu.

CrUX, HTTP Archive, Web Almanac, WPO Stats, rapoarte interne și publice și instrumente de analiză a afacerii de la servicii și pluginuri independente – toate dedicate calculării cifrelor și oferind transparență eforturilor proprietarilor de site-uri pentru o experiență mai bună a utilizatorului.

✦ Noi prezicem...

2024 va marca un pas semnificativ înainte în înțelegerea experiențelor reale ale utilizatorilor pe site-uri web, făcând din Core Web Vitals o măsură esențială pentru proprietarii de afaceri și comercianții de comerț electronic, care îl conectează direct la rezultatul lor.

„Privindu-mă în 2024, văd o schimbare pozitivă în modul în care abordăm performanța web. Îndepărtăm doar de a privi datele de laborator și ne concentrăm mai mult pe experiența reală a utilizatorului. Este o perioadă interesantă, cu o mulțime de idei noi care apar pentru a face site-urile web mai rapide pentru toată lumea. La NitroPack, suntem cu adevărat fericiți să facem parte din această schimbare, ajutând să facem web-ul un loc mai bun pentru utilizatori.”

— Georgi Petrov, CEO și co-fondator @NitroPack


Rolul AI: următorii pași în optimizarea performanței web

Boom-ul AI a afectat întreaga lume și îi pune pe mulți proprietari de afaceri să se gândească la oportunitățile pe care le poate debloca.

De fapt, numai în 2023, 35% dintre companii folosesc deja AI în afacerile lor, serviciile financiare, asistența medicală, comerțul cu amănuntul și producția luând conducerea în adoptarea AI.

În optimizarea performanței web, am văzut deja primele progrese făcute cu API-ul pentru regulile de speculație de Chrome. Indiferent dacă este folosit pentru automatizarea sarcinilor, îmbunătățirea fluxurilor de lucru și crearea de noi servicii și produse, AI în industria WPO va permite proprietarilor de site-uri să răspundă cererii în creștere pentru o experiență mai bună a utilizatorului și o viteză de încărcare mai bună.

Aplicarea sa în domenii precum analiza predictivă, recunoașterea modelelor și livrarea de conținut personalizat a îmbunătățit semnificativ experiențele utilizatorilor.


✦ Noi prezicem...

În 2024, AI va fi un nou capitol promițător în strategiile de optimizare – de la analiza predictivă și recunoașterea modelelor până la funcționalități anticipative, progresele ne vor ajuta să înțelegem mai bine comportamentul utilizatorului și să răspundem mai rapid nevoilor utilizatorului.


Gânduri finale

Pe măsură ce 2024 se apropie, accentul rămâne pe menținerea acestui impuls.

Progresele continue și adoptarea timpurie a tehnicilor potrivite de optimizare a performanței web vor deschide calea pentru o experiență web și mai rapidă și mai eficientă.

Iată un 2023 rapid și să lucrăm cu toții pentru un 2024 și mai rapid!