Cum se reduc cererile HTTP / S în WordPress

Cum se reduc cererile HTTP / S în WordPress

Iată o poveste care vă va plăcea dacă doriți să accelerați site-ul dvs. WordPress.


A doua zi am construit un site web strălucitor. Am ieșit toate și am adăugat WooCommerce, Google Tag Manager, OneSignal, helpdesk, Yoast, radio în direct (oh da, am făcut-o), Cookie Notice, social media și o mulțime de alte plugin-uri..

La fel ca tine, m-am aplecat să-mi impresionez vizitatorii, sau așa am crezut. Dar atunci lucrurile au devenit insuportabil de lente. După multă supărare, am tras GTMetrix pentru a înlătura problema.

Spre disperarea mea, am văzut asta:

rezultatele testului de viteză gtmetrix

Am fost impresionat? La naiba! Am vrut să marchez o A perfectă și să reduc timpul de încărcare a paginii la sub două secunde.

Așadar, am apăsat butonul de re-test, dar ghiciți ce? Cu toate acestea, același rezultat s-a aflat. Eram îngrozit, furios chiar. Dar nu renunț cu ușurință, pentru că acest lucru este inacceptabil.

Știi ce am făcut în continuare? Am testat site-ul pe Pingdom deoarece GTMetrix îl poate sug. Dar, mai jos, sunt încă o dată rezultatele nefaste:

instrumente pingdom viteza rezultatelor testelor

Eram exasperat. Gura proverbială în carnea mea a fost cererile HTTP errante, văzând cum puteam rezolva rapid multe dintre celelalte probleme.

Pentru a înrăutăți, am folosit o temă WordPress de comerț electronic care a încărcat un miliard elemente pentru construirea paginii de pornire. În apărarea mea, părea incredibil. Unii utilizatori au fost de acord că designul este pe măsură, deci, nu m-am pronunțat doar pentru truc ��

Dar designul vizual excelent și viteza lentă nu merg mână în mână. Aveam nevoie de o soluție și rapid.

Cum pot reduce solicitările HTTP pe site-ul meu WordPress?

De fiecare dată când vizitați un site WordPress, o mulțime de date se deplasează între browserul dvs. și serverele site-ului. Cu alte cuvinte, WordPress face solicitări HTTP către diverse servere pentru a construi ceea ce văd utilizatorii când își încarcă site-ul.

Dacă site-ul dvs. WordPress necesită o mulțime de elemente de încărcat, veți avea mai multe solicitări HTTP și invers. Mai multe solicitări HTTP înseamnă un site web lent, experiență slabă a utilizatorului (UX), scoruri SEO proaste și rate scăzute de conversie.

Site-urile WordPress sunt de obicei dinamice, ceea ce înseamnă că este nevoie de o mulțime de părți diferite pentru a reda site-ul dvs. într-un browser. Vestea bună este că puteți reduce solicitările HTTP și puteți accelera site-ul dvs. în mod semnificativ.

Și în postarea de astăzi, înveți exact cum!

Rapoartele de la GTMetrix și Pingdom vă arată de obicei unde se află problema. Ca atare, testează-ți site-ul folosind ambele instrumente pentru a afla zonele pe care trebuie să le îmbunătățești. Cu rapoartele gata, iată cum puteți reduce solicitările HTTP / S și accelera site-ul dvs. WordPress.

Pasul 1: Declutter

Băieți, dacă aveți o mulțime de lucruri pe site-ul dvs. WordPress, veți avea prea multe solicitări HTTP. Nu este o idee sigură. Primul pas pentru reducerea cererilor HTTP este declanșarea.

Prin aceasta, vreau să scap de toate pluginurile de care nu ai nevoie. Pluginurile WordPress vin cu o mulțime de fișiere, fie ele PHP, CSS sau JavaScript (JS). Fiecare fișier lansat de fiecare plugin va crea o solicitare HTTP.

Dacă aveți o mulțime de plugin-uri, veți avea cu siguranță mai multe solicitări HTTP. Cu cât sunt mai puține plugin-uri, cu atât mai puține solicitări. Este simplu.

Ce sa fac?

Efectuați un audit al pluginurilor dvs. Ce pluginuri trebuie să aveți pentru a rula site-ul dvs. web? Există pluginuri de care nu aveți nevoie? Aveți plugin-uri care se conectează la serverele terțe? Puteți face fără aceste plugin-uri?

Pentru a reduce solicitările HTTP, dezinstalați toate pluginurile de care nu aveți nevoie. Dacă aveți nevoie de un plugin ocazional, instalați-l doar atunci când aveți nevoie. După aceea, dezinstalați pluginul.

Același lucru este valabil și pentru temele și conținutul WordPress pe care nu le utilizați. Curățați toate lucrurile. Eliminați orice nu aveți nevoie; este bine pentru viteza și securitatea site-ului dvs..

Puteți parcurge suplimentar mile suplimentare și încărcați pluginurile. De exemplu, dacă aveți nevoie doar de Formularul de contact 7 pentru a încărca pe pagina dvs. de contact, puteți opri încărcarea altor pluginuri pe acea pagină specifică.

Ar fi minunat, nu ești de acord? Și să crezi că ai nevoie doar de Plugin WordPress Asset CleanUp.

WP Asset CleanUp plugin WordPress

Pluginul este ușor de utilizat și destul de eficient. Sau după cum spune dezvoltatorul:

„Clean Asset” scanează pagina dvs. și detectează toate activele care sunt încărcate. Tot ce trebuie să faceți atunci când editați o pagină / postare este doar să selectați CSS / JS care nu sunt necesare pentru a încărca, reducând astfel balonul.

Curățați instalarea deja hombre; scapi de junk – spam-ul de comentarii inclus. Oh, da, elimina legăturile stricate și optimizează-ți baza de date, de asemenea, la ea. Acestea sunt domenii semnificative pe care trebuie să le iei în considerare în ceea ce privește îmbunătățirea vitezei site-ului tău, dar mă descurc.

Să revenim la reducerea cererilor HTTP.

Pasul 2: Optimizarea imaginilor

Un site web fără imagini este, bine, drab. Ei spun că o imagine spune o mie de cuvinte și că este fain. Dar fiecare imagine reprezintă o solicitare HTTP. Pentru a adăuga sare la vătămare, imaginile sunt în topul elementelor care necesită mult timp la încărcare.

Cu toate acestea, nu putem ignora faptul că majoritatea temelor WordPress (site-urile citite) se bazează pe imagini și multe imagini în acest sens. Deci, având în vedere acest lucru, cum puteți reduce solicitările HTTP prin optimizarea imaginilor?

Pentru început, scapă de toate imaginile pe care nu le folosești. Fii nemilos; scăpați de tot ce-i umblă – nu aveți nevoie. După aceea, comprimați și optimizați imaginile pentru a elimina datele de fișiere inutile.

WP Compress Plugin

Info și descărcareVizualizați Demo

Deși există o serie de pluginuri din care să alegem, ne place foarte mult WP Compress. Deși este un serviciu premium, optimizarea automată puternică a imaginilor, compresia fără pierderi, procesarea în cloud pentru a reduce încărcarea serverului, suportul de imagine WebP, redimensionarea automată și mai mult fac ca investiția să merite bine (consultați recenzia noastră pentru a afla mai multe). În plus, poți fi declarat cu 100 de imagini gratuit – așa că poți măcar să încerci.

Optimizarea imaginilor nu reduce solicitările HTTP în sine, dar reduce dimensiunea fișierelor dvs. de imagine, ceea ce se traduce la viteze mai bune ale paginii în jos..

În mod alternativ pentru a reduce solicitările HTTP, folosiți puterea Sprituri de imagine CSS. Pentru cei neinițiați, un sprite este o colecție de imagini puse într-un singur fișier de imagine.

Apoi folosind trucuri CSS, puteți alege ce parte a imaginii să arate. Dar cum reduce acest lucru solicitările HTTP? Iată o analogie.

Spuneți că aveți nevoie de cinci imagini pe pagina dvs. de pornire. Pentru a vă încărca site-ul, instalarea dvs. WordPress va face cinci călătorii pe server pentru a obține imaginile. Acum, dacă puneți toate cele cinci imagini într-un singur fișier imagine (sprite), instalarea dvs. de WordPress va face o singură călătorie.

Vedeți unde merg cu asta? Cu cât sunt mai puține călătorii, cu atât este mai mică cererea HTTP. Cea mai bună parte este că nu trebuie să transpirați pentru a crea și implementa sprituri de imagine CSS. Puteți utiliza un instrument cum ar fi CSS Generator Sprite. Implementarea spriturilor de imagine CSS este ușoară, cu condiția să vă cunoașteți drumul în jurul CSS.

Sfat Pro: Puteți uita totul despre spriturile de imagine CSS dacă site-ul dvs. web folosește HTTP / 2 care acceptă încărcarea asincronă a imaginilor și scripturilor. GTMetrix nu ia în considerare HTTP / 2 la notarea performanței, deci nu vă faceți griji dacă se pare că imaginile dvs. creează o tonă de solicitări HTTP.

Dar eu zic: Dacă spriturile de imagine CSS pot reduce solicitările HTTP în mod semnificativ pe site-ul dvs. și știți cum să implementați același lucru, accesați-l și apăsați acele secunde în plus din timpul de încărcare a paginii. Indiferent dacă aveți sau nu HTTP / 2.

La urma urmei, un singur fișier imagine necesită o singură solicitare HTTP. Zece imagini separate au nevoie de 10 cereri HTTP și așa mai departe. Știu că ai în derivă.

Pasul 3: Combinați și minimați HTML, CSS și JavaScript

Cauza majoră a multor solicitări HTTP de pe site-ul meu WordPress a fost fișierele CSS externe și JavaScript. Da, am avut parte de 43 de scripturi JS și 22 de fișiere CSS. Este vorba despre 66 de solicitări HTTP.

Din aproximativ 130 de solicitări HTTP, cererile CSS externe și JavaScript au reprezentat aproximativ 51% a problemei! Este doar ridicol. Mulțumesc, GTMetrix, dă-mi pumnul.

Dacă combin și minimizez cele 44 de fișiere JS și 22 CSS, pot reduce în mod semnificativ solicitările HTTP, dimensiunea site-ului web și timpul necesar pentru încărcare. Dar despre ce este vorba despre „combinarea” și „minifierea” afacerilor?

Conform Raelene Morey of Words by Birds (sunt un fan imens ��), minificarea este procesul de „… eliminarea oricăror caractere inutile, cum ar fi comentariile, formatarea, spațiul alb și liniile noi din fișierele HTML, CSS și JavaScript care nu sunt necesare pentru fișierele cod de executat. “

Minifying reduce dimensiunea fișierului eliminând toate celelalte caractere pentru a lăsa doar codul. Dar dacă aveți peste 66 de scripturi externe, minificarea nu va face prea mult pentru a minimiza cererile HTTP. Pentru asta, trebuie să combinați fișierele CSS și JavaScript.

Din nou, Raelene spune:

Între timp, combinarea fișierelor este exact așa cum sună. De exemplu, dacă pagina dvs. web încarcă 5 fișiere CSS externe și 5 fișiere JavaScript externe, combinând CSS și JavaScript într-un singur fișier separat fiecare ar rezulta în doar 2 solicitări în loc de 10.

Ai inteles? Sper că sper. Combinarea fișierelor reduce solicitările HTTP. Minimizarea, pe de altă parte, reduce dimensiunea fișierului. Combinați cele două și ucizi două păsări cu aceeași piatră.

Există pluginuri? Da, desigur!

WP Rocket Plugin Cache WordPress

Informații și descărcareVizualizați demonstrația

Există o mulțime de plugin-uri WordPress pentru a combina și minimiza fișierele. Un exemplu bun este pluginul WP Rocket. Practic, este unul dintre cele mai bune pluginuri de memorie în cache care vă oferă funcții pentru a combina și minifica fișierele în câteva clicuri.

Un alt popular (și liber) opțiunea este Autoptimize conecteaza.

Apropo, în timp ce se află la ea, reduceți numărul de fișiere CSS externe și scripturi JS? De exemplu, și nu menționăm aici numele, aveți nevoie într-adevăr de o platformă de comentarii terță parte? Aveți nevoie de un plugin radio în direct?

Nu contează ce spun, elimina toate scripturile externe și toate fișierele de care nu ai nevoie.

Pasul 4: Ajustați fișierele CSS și JavaScript de blocare a redării

În unele cazuri, combinarea fișierelor nu poate fi o opțiune, în special pentru fișierele terțe și scripturile care se schimbă frecvent. În astfel de cazuri, puteți amâna încărcarea acestor active. HTTP / 2 acceptă încărcarea asincronă a fișierelor, ceea ce înseamnă că toate fișierele se încarcă simultan.

Dacă nu aveți încărcarea asincronă din anumite motive (poate că nu utilizați HTTP / 2 sau scripturile nu sunt asincrone), aceste fișiere pot încetini site-ul dvs. în mod semnificativ.

Rețineți că paginile dvs. web se încarcă de sus în jos. Dacă aveți CSS și JS care blochează redarea în partea de sus a paginii, browserul nu va mai încărca până când fișierele vor fi încărcate complet. Ca atare, utilizatorii vor vedea o pagină goală până când se vor încărca scripturile, care durează timp.

Cum? Mutați toate scripturile care blochează redarea de sus în partea de jos a paginii dvs. web. Dar ai grijă aici; nu trebuie să mutați toate scripturile în partea de jos. Spun asta, deoarece pagina dvs. ar putea avea nevoie de CSS și JS pentru a oferi o experiență atractivă.

Dacă amânați unele fișiere CSS sau JavaScript, utilizatorii dvs. ar putea vedea o versiune distorsionată a paginii dvs. web până când pagina se încarcă complet, ceea ce este exact opusul a ceea ce doriți să obțineți.

Deci, amânați scripturile care nu sunt necesare pentru încărcarea paginii. În acest fel, utilizatorii dvs. nu vor aștepta vârste pentru încărcarea paginii dvs. De ce? Pentru că veți avea nevoie de mai puține solicitări HTTP pentru a vă livra mesajul.

Nu reduce solicitările HTTP în sine (deoarece toate scripturile și fișierele se vor încărca în cele din urmă), dar reduce numărul de solicitări HTTP necesare pentru redarea paginii dvs..

Seamănă foarte mult cu încărcarea leneșă pentru imagini; imaginea este încărcată doar atunci când este în viewport, nu și atunci când se încarcă restul (și cele mai importante părți) ale paginii.

Apropo, remedierea CSS și JS cu blocare de randare poate dezvălui fișiere și scripturi de care nu este nevoie să creezi o pagină web.

De exemplu, dacă un script JS de partajare socială externă durează mult timp la încărcare, îl puteți amâna. În plus, puteți să-l eliminați și să vă construiți partajarea socială în tema dvs..

Veți elimina cererile HTTP și veți accelera site-ul dvs. păstrând aceeași funcționalitate. Am înțeles că funcțiile de codare în tema dvs. sunt o comandă înaltă pentru majoritatea începătorilor, așa că consultați un utilizator WP avansat sau un dezvoltator.

Ca alternativă, puteți utiliza pluginul WP Rocket pentru a remedia scripturile care blochează redarea, dar fiți atenți. Citiți documentația lor, deoarece dacă încurcați lucrurile, puteți să vă rupeți site-ul cu ușurință.

Există opțiuni gratuite? Desigur! Lucrăm cu WordPress, nu-ți amintești? Puteți utiliza funcția Async JavaScript, printre alte plugin-uri.

Pasul 5: Utilizați Caching și CDN

Știați că memoria cache și CDN-urile vă pot reduce solicitările HTTP? La început nu pare a fi un fapt, dar când luați în considerare ce se întâmplă în culise, puteți folosi memorarea în cache și CDN în avantajul dvs..

Caching-ul presupune stocarea fișierelor statice pe un browser, astfel încât utilizatorii să nu descarce fișierele în vizitele ulterioare. Spuneți că aveți un plugin pentru cache, iar utilizatorul descarcă conținutul în cache la prima vizită.

La vizitele ulterioare, site-ul dvs. nu va face solicitări către server. În schimb, va servi resursele în cache din browser, reducând cererile HTTP și sporind viteza site-ului.

Un CDN (sau Content Delivery Network) este o rețea de servere plasate în întreaga lume. Un CDN folosește și cache, dar pentru viteze și mai rapide, furnizorul CDN vă servește în cache conținut de pe un server cel mai apropiat de vizitator.

Distanțele mai scurte înseamnă o livrare mai rapidă a conținutului, iar caching-ul înseamnă că site-ul dvs. web nu mai trebuie să descarce același conținut de pe serverul central din nou. Are sens pentru tine?

Plugin CDN Cloudflare

Și cel mai bine, există o serie de opțiuni CDN gratuite (sau cel puțin probe gratuite, astfel încât să puteți vedea literalmente diferența pe care o face). La WPExplorer folosim și recomandăm cu mare încredere CLoudflare, dar alegeți CDN-ul pe care îl considerați că funcționează cel mai bine pentru dvs..

Bonus: Asigurați-vă că HTTP / 2 este acceptat

S-ar putea să faceți totul pentru a reduce solicitările HTTP, dar gazda dvs. web ar putea fi cauza problemelor. Nu vă mirați; întrebând și gândind, cine – în acest timp și vârstă – folosește altceva decât HTTP / 2?

Probabil că nici nu știi ce HTTP / 2 e totul despre. Ei bine, pentru început, HTTP / 2 acceptă încărcarea asincronă a fișierelor, printre altele. Are alte avantaje față de HTTP 1.0, dar aceasta este o lecție pentru o altă zi.

Dacă utilizați HTTP 1.0 sau o versiune mai mică, veți observa un număr considerabil de solicitări HTTP.

Nu vă lăsați repede să judecați; Am văzut furnizori de găzduire web care încă utilizează HTTP 1.0 și versiuni mai vechi de PHP. Da, chiar și cu avantajele aparente ale HTTP / 2 și PHP 7. Nici măcar nu suflu; unii dintre clienții lor vin la mine atunci când unele dintre plugin-urile lor nu funcționează și este iritant!

Dar, de fapt, de ce? Faptul că unii furnizori de găzduire web nu sunt deranjați de faptul că PHP 5.6 este depășit și are vulnerabilități de securitate este altceva. Și dacă nu acceptă HTTP / 2, acesta este un distribuitor pentru dvs. cu adevărat.

Testul KeyCDN HTTP / 2

Contactați gazda sau utilizați Instrumentul KeyCDN pentru a verifica dacă serverul dvs. acceptă HTTP / 2. Cea mai bună web host acceptă HTTP / 2 și cea mai recentă versiune de PHP. Dacă gazda dvs. a rămas în ambele cazuri, cereți-le să actualizeze sau să aleagă o gazdă web mai bună.

Cuvinte finale

Reducerea cererilor HTTP pe site-ul dvs. WordPress înseamnă doar eliminarea lucrurilor de care nu aveți nevoie. Dacă aveți o mulțime de lucruri pe site-ul dvs. WordPress, veți avea o mulțime de solicitări HTTP și viteze de pagină relativ lente.

Pentru a reduce solicitările HTTP, declanșați-vă site-ul, optimizați imaginile, reparați scripturile care blochează redarea, folosiți memoria de memorie în cache și asigurați-vă că gazda dvs. acceptă HTTP / 2. În afară de asta, încercați-vă să creați site-uri web simple și curate care nu necesită o tonă de active pentru a fi încărcate.

Dacă aveți întrebări, vă rugăm să ne informați în secțiunea de comentarii de mai jos. Urez-te la site-uri web mai rapide și un viitor deosebit!

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map