În lumea de astăzi, site-urile care duc rapid la implicarea, reținerea și conversiile vizitatorilor. Există o mulțime de factori care contribuie la viteza site-ului web; unul dintre acestea este numărul solicitării HTTP.
În acest tutorial, voi explica ce sunt solicitările HTTP, cum se determină numărul de cereri HTTP, efectele pe care le au asupra performanței WordPress, modul în care pluginurile și temele nu ajută la probleme și soluțiile la problemă.
Atunci când un browser web redă o pagină web, acesta trimite o cerere către serverul web prin intermediul HTTP pentru resurse statice sau componente (cum ar fi imagini, CSS și JavaScript), iar serverul răspunde și trimite fișierele în browser. Astfel, o cerere trimisă de browser către server folosind HTTP
este denumită cerere HTTP.
Pentru a înțelege mai bine semnificația unei solicitări HTTP, aruncați o privire la codul HTML al unei pagini web simple:
Din imaginea de mai sus, ați putea vedea că există un total de patru Solicitări HTTP
.
Potrivit regulii de performanță a Yahoo:
80% din timpul de răspuns al utilizatorului final este cheltuit pe front-end. Majoritatea timpului este legat de descărcarea tuturor componentelor din pagină: imagini, foi de stil, scripturi, Flash, etc. Reducerea numărului de componente reduce la rândul lor numărul de cereri HTTP necesare pentru renderarea paginii. Aceasta este cheia pentru paginile mai rapide.
Din fragmentul de mai sus, avem dreptate să deducem că, cu cât numărul de cereri HTTP este mai mic, cu atât site-ul este mai rapid; prin urmare, un site web alimentat WordPress cu multe imagini și fișiere CSS și JavaScript cu referință externă tind să fie lent.
Utilizând extensia Firebug a Firefoxului și Inspectează elementul
instrument pentru Google Chrome și Opera, puteți determina cu ușurință numărul de cereri HTTP ale unei pagini Web.
Să vedem cum să verificăm numărul de cereri HTTP din blogul nostru WordPress.
Asigurați-vă că aveți instalat extensia Firebug.
F12
pentru a deschide consola Firebug.Net Panel
. dacă este dezactivată, activați-o.Spre deosebire de Firefox, nu aveți nevoie de o extensie în Chrome și Opera pentru a verifica solicitarea HTTP, mai degrabă cea încorporată Inspectează elementul
instrumentul este utilizat.
Pașii de mai jos sunt valabili atât pentru Chrome, cât și pentru Opera.
Inspectează elementul.
Panoul de rețea
și reîmprospătați site-ul dvs. WordPress.Știți că instalarea celor mai multe pluginuri WordPress mărește numărul de componente ale paginilor web, mărind astfel numărul de cereri HTTP?
O mulțime de plugin-uri pe care le instalăm mărește numărul de solicitări HTTP ne-cunoștință pentru noi.
Cele mai multe pluginuri se bazează pe fișierele lor personalizate, CSS și JavaScript pentru ca acestea să funcționeze. Ei fac acest lucru prin adăugarea unui link care face trimitere la aceste componente la WordPress, care, la rândul lor, mărește numărul de solicitări HTTP.
Ca un caz robust, vom folosi Formularul Abonatului WP pentru a înțelege pe deplin modul în care pluginurile cresc Solicitare HTTP
.
Activarea pluginului va adăuga un formular de abonare la sfârșitul conținutului mesajului și va include și un link către acesta foaie de stil externă la WordPress.
Vizionarea sursa paginii
din site-ul dvs. WordPress după activarea pluginului va dezvălui adăugarea unei noi componente CSS după cum se arată mai jos, ceea ce înseamnă o creștere a cererilor HTTP.
Ca pluginuri, temele WordPress conțin o mulțime de componente CSS și JavaScript. O temă tipică constă din fonturi încorporate, CSS și componente JavaScript care duc la creșterea numărului de solicitări.
Dimensiunea fiecărei componente individuale a site-ului are, de asemenea, un efect asupra performanței WordPress. cu cât dimensiunea este mai mică, cu atât mai rapidă este solicitarea HTTP către componentă, deoarece browserul petrece mai puțin timp descărcându-l ca rezultat al dimensiunii mici.
Dimensiunea componentelor CSS și JavaScript poate fi redusă prin minimizare (eliminând toate caracterele inutile și spațiul liber din codul sursă).
Pentru a reduce numărul de cereri HTTP, trebuie să reduceți numărul de imagini, fișierele CSS și JavaScript pe WordPress.
Știu că ideea reducerii numărului de imagini de pe blog-ul dvs. ar putea să nu meargă bine cu unii dintre noi, dar ar trebui să încercați cât mai mult posibil să eliminați orice imagini care nu sunt critice pentru aspectul site-ului nostru.
Temele WordPress folosesc fundal imagini
în CSS pentru a-și spori frumusețea. Ați putea reduce numărul de imagini transformându-le în sprite. Vedeți acest articol al lui A List Apart și Tuts + Screencast pentru a înțelege cum funcționează spiritele CSS.
Performanța WordPress poate fi îmbunătățită semnificativ atunci când temele "CSS și JavaScript sunt combinate și minificate.
Există câteva pluginuri WordPress, cum ar fi WP Minify și WordPress Minify Better (am folosit și le voi recomanda aceste pluginuri) care combină JavaScript și CSS într-un singur fișier, reducând astfel numărul de solicitări HTTP.
Dacă utilizați pluginul W3 Total Cache, nu este nevoie să instalați pluginurile de mai sus, deoarece are o opțiune de a minimiza și combina CSS și JavaScript.
În calitate de dezvoltator, editez pluginuri care adaugă elemente suplimentare pe blogul meu WordPress, tăind CSS și JavaScript adăugate de pluginuri și inserându-le în fișierul tematic CSS și JavaScript, astfel încât acestea să fie unificate.
Importanța vitezei site-ului nu poate fi subliniată. Un site care leagă lent vizitatorii.
Există o mulțime de bune practici pentru accelerarea site-ului și una dintre acestea reduce numărul de cereri HTTP pe care le-am învățat în acest articol.