Începuturile 103 în practică - LCP mai rapid

Early Hints 103 este unul dintre cele mai eficiente “trucuri” de optimizare a performanței disponibile în 2026. Acesta elimină efectiv “timpul de inactivitate” pe care browserul îl petrece așteptând ca serverul mybox să genereze cod HTML. Prin trimiterea imediată a unui cod de stare 103, CDN-ul indică browserului exact ce fișiere să înceapă să descarce înainte ca primul byte al paginii web propriu-zise să existe măcar.

Pe un site tipic mybox, acest lucru poate reduce Largest Contentful Paint (LCP) cu 15% până la 25%.

Cum funcționează Early Hints (Logica 2026)

De obicei, parcursul browserului arată astfel:

1. Solicitare: Browserul solicită homepage.html.
2. Așteptare: Serverul dvs. mybox procesează PHP, interoghează baza de date și generează codul HTML (acesta este TTFB).
3. Răspuns: Codul HTML ajunge; browserul constată în cele din urmă că are nevoie de style.css și font.woff2.
4. Descărcare: Browserul începe să descarce aceste fișiere.

Cu Early Hints 103:

1. Solicitare: Browserul solicită homepage.html.
2. Indiciu 103: În aproximativ 20 ms, CDN-ul trimite un răspuns 103: “Hei, vei avea nevoie de style.css și main-font.woff2. Începe acum!”
3. Lucru în paralel: În timp ce serverul mybox încă se gândește, browserul descarcă deja CSS-ul și fonturile.
4. Răspuns 200: HTML-ul ajunge, dar descărcarea CSS-ului s-a încheiat deja. Pagina se afișează instantaneu.

Pasul 1: Activarea Early Hints pe Cloudflare

Pentru majoritatea utilizatorilor de pe mybox, Cloudflare este cel mai simplu mecanism de livrare.

1. Tabloul de bord: Accesați Viteză > Optimizare în tabloul de bord Cloudflare.
2. Sugestii timpurii: Comutați comutatorul pe Activat.
3. Sugestii timpurii inteligente: Activați această opțiune dacă doriți ca Cloudflare să “ghicească” automat ce resurse să sugereze pe baza modelelor de trafic anterioare.
4. Antete de legătură: Pentru cele mai bune rezultate, ar trebui să specificați manual “indiciile” prin intermediul antetelor de răspuns ale serverului mybox.

Pasul 2: Identificarea sugestiilor cu “impact ridicat”

Scopul este să acționați cu precizie. Dacă marcați prea multe fișiere, creați o “concurență pentru lățimea de bandă”, ceea ce, de fapt, încetinește pagina. Limitați-vă la aceste trei:

Pasul 3: Implementare prin WPCode pe mybox

Nu este nevoie să editați fișierele temei. Utilizați un fragment de cod PHP în WPCode pentru a trimite aceste antete:

PHP

function mybox_early_hints_headers() {
 if ( is_front_page() ) {
 header( 'Link: ; rel=preload; as=style', false );
 header( 'Link: ; rel=preload; as=font; crossorigin', false );
 }
}
add_action( 'send_headers', 'mybox_early_hints_headers' );

Pasul 4: Capcane frecvente și cele mai bune practici pentru 2026

• Regula “Crossorigin”: Pentru fonturi, trebuie să includeți atributul crossorigin în indicația dvs. Dacă îl omiteți, browserul va descărca fontul de două ori, dublând timpul de încărcare.
• Numai HTTPS: Early Hints 103 funcționează numai prin HTTP/2 sau HTTP/3. Asigurați-vă că certificatul SSL mybox este valabil și activ.
• Nu includeți în “hint” resursele “lazy”: Nu includeți niciodată în "hint" imagini sau scripturi care se află sub zona vizibilă a paginii (cum ar fi un script din subsol sau o galerie din partea de jos a paginii). Acest lucru risipește traficul de date al utilizatorului și încetinește LCP.
• Variați în funcție de șablon: Lista dvs. de "indicii" pentru o pagină de produs ar trebui să fie diferită de cea pentru blogul dvs. Utilizați etichete condiționale (is_product(), is_single()) în fragmentul dvs. de cod PHP pentru a asigura indicii relevante.

Pasul 5: Cum să verificați dacă funcționează

Nu puteți vedea ușor codul de stare 103 în fila standard "Rețea", deoarece este un răspuns "provizoriu".

1. Terminal/Linia de comandă: Utilizați curl -I -H "Connection: Upgrade" -H "Upgrade: h2c" https://yourdomain.com.
2. Căutați: Ar trebui să vedeți HTTP/2 103 urmat de anteturile Link și apoi de răspunsul HTTP/2 200.
3. WebPageTest: Efectuați un test pe WebPageTest.org și analizați graficul "Waterfall". Veți observa că descărcările de resurse încep înainte ca bara violetă "HTML" să se finalizeze.

Rezumat

Early Hints 103 este cea mai apropiată tehnică de „călătoria în timp” în ceea ce privește performanța web. Oferind browserului un avans în timp ce serverul dvs. mybox este ocupat, asigurați o viteză percepută ca fiind instantanee de către utilizatori.