Cum să faceți mai puține solicitări HTTP în WordPress și GTmetrix YSlow

Trebuie să faceți mai puține solicitări HTTP pe site-ul dvs. WordPress?


Acest lucru înseamnă doar că trebuie să reduceți câte elemente (cereri) se încarcă pe site-ul dvs..

Efectuați mai puține solicitări HTTP

Combinarea fișierelor CSS și JavaScript vă poate ajuta, dar există și alte optimizări care pot reduce solicitările HTTP, cum ar fi dezactivarea selectivă a pluginurilor care nu trebuie încărcate pe anumite pagini, dezactivarea scripturilor și stilurilor WooCommerce în paginile care nu sunt comerț electronic, sau evitarea procesorului înalt plugin-uri care generează un număr mare de solicitări și încetinesc site-ul.

Efectuarea mai puține cereri HTTP este o recomandare în GTmetrix, Pingdom și alte instrumente de testare a vitezei. Recomandările de mai jos vor ajuta la reducerea solicitărilor și la îmbunătățirea site-ului.

1. Combinați foile de stil CSS + JavaScript

Combinarea foilor de stil CSS + JavaScript înseamnă că trebuie să copiați / lipiți toate fișierele CSS într-un singur fișier. Acest lucru permite browserelor să facă o singură solicitare pentru un fișier CSS în loc de mai multe solicitări. Majoritatea pluginurilor din cache au o opțiune de a combina fișierele CSS + JavaScript.

Pasul 1: În setările pluginului dvs. de cache, găsiți opțiunea de a combina și minifica CSS + JavaScript.

Pasul 2: Activează fiecare setare la un moment dat și testează rezultatele în GTmetrix.

Minimizați Combinarea fișierelor CSS

Minimizați Combinarea fișierelor JavaScript

Pasul 3: Verificați erorile vizibile pe site-ul dvs. web. Dacă vedeți erori, vizualizați codul sursă, găsiți fișierele problematice și excludeți-le din setările CSS sau de minificare JavaScript. De exemplu, dacă glisorul tău dispare la activarea unei anumite setări, verificați fișierele glisante din codul sursă și excludeți fișierul cu probleme. Dacă nu observați erori, nu este necesar acest lucru.

În mod alternativ, puteți combina manual fișierele CSS în WordPress sub aspect > Editorul temei. Pur și simplu copiați și lipiți conținutul din toate fișierele într-un singur fișier CSS.

Fișiere CSS WordPress

2. Dezactivați selectiv pluginurile

Multe plugin-uri rulează pe întregul site, chiar și în paginile unde nu sunt necesare.

Formularele de contact, partajarea socială, fragmentul bogat, slider-ul și alte alte plugin-uri trebuie să fie încărcate doar pe anumite tipuri de conținut. Le puteți dezactiva oriunde altundeva utilizând CleanUp de active.

Prin dezactivarea plugin-urilor în paginile unde nu trebuie să fie încărcate, aceasta duce la mai puține solicitări HTTP. Aceasta nu se limitează la pluginuri; scripturile și stilurile pot fi, de asemenea, dezactivate pe anumite pagini (de exemplu, scripturile WooCommerce, stilurile, fragmentele de coș pot fi dezactivate în paginile care nu sunt comerț electronic).

Pasul 1: Instalați Asset CleanUp sau Perfmatters (ambele vă permit să dezactivați selectiv pluginurile).

Pasul 2: Editați o pagină sau o postare, derulați în jos în secțiunea CleanUp Asset și examinați ce fișiere CSS + JavaScript se încarcă pe pagină. Acestea pot fi de la pluginuri, teme sau scripturi externe.

Dezactivați scripturile externe WordPress

Pasul 3: Dezactivați toate pluginurile și solicitările de care nu aveți nevoie pe pagina respectivă. Le puteți dezactiva pe o singură pagină, pe întregul site, după tipul de postare sau puteți utiliza RegEx (expresii obișnuite) pentru a le dezactiva pe anumite tipare URL. RegEx este inclus numai cu Perfmatters sau Asset CleanUp Pro.

3. Dezactivează scripturile WooCommerce, stilurile, fragmentele de coș

Site-urile WooCommerce generează în mod natural mai multe cereri HTTP.

Nu numai că, de obicei, necesită mai multe plugin-uri, dar, de asemenea, se încarcă scripturi WooCommerce suplimentare, stiluri, și fragmente de coș. La fel cum puteți dezactiva selectiv plugin-urile din pasul anterior, puteți dezactiva, de asemenea, selectiv cererile WooCommerce de încărcare pe întregul site.

Folosind Asset CleanUp sau Perfmatters, dezactivați-le pe paginile unde nu trebuie să se încarce:

Asset CleanUp WooCommerce

În mod alternativ, Perfmatters vă permite să le dezactivați în 1 clic:

perfmatters optimizarea woocommerce-ului

4. Evitați plugin-urile cu procesor înalt

Plugin-urile cu procesor înalt pot genera o tonă de solicitări HTTP.

Acestea sunt, de obicei, partajare socială, statistici (analitice), glisante, portofolii, creatori de pagini, calendare, chat și pluginuri de formular de contact. Practic, evitați orice plugin care atrage solicitări externe de pe site-urile externe, rulează procesele în curs sau pur și simplu durează mult timp la încărcare.

Pasul 1: Verificați dacă există plugin-uri lente în Cascada GTmetrix sau Monitor de interogare.

Slow-WordPress-Plugin

Pasul 2: Evitați plugin-urile cu procesor înalt cunoscute.

  1. Adaugă asta
  2. Faceți clic pe AdSense Monitorizarea fraudelor
  3. Calendar de evenimente All-In-One
  4. Copie de rezervă
  5. Castor constructor
  6. Mai bune Sitemap-uri Google XML WordPress
  7. Verificator de legături sparte (folosiți Dr. Link Check)
  8. Contact constant pentru WordPress
  9. Formular de contact 7
  10. Vezi toate cele 65 de pluginuri lente

Pasul 3: Înlocuiți pluginurile lente cu pluginuri mai rapide și ușoare. Cercetarea și testarea sunt necesare.

5. Înlocuiți pluginurile cu Cod

Puteți evita multe plugin-uri înlocuindu-le cu cod.

Exemple:

  • Fonturi Google: găzduiește-ți fonturile la nivel local
  • Cod de urmărire Google Analytics: introduceți manual
  • Cuprins: proiectați-l manual în HTML + CSS
  • Tweeturi încorporate sau Google Maps: luați în schimb o captură de ecran
  • Widget Facebook încorporat: înlocuiți cu widget Facebook real

Consolidarea pluginurilor ajută, de asemenea. Un exemplu clasic este utilizarea WP Rocket care vine cu fonturi de găzduire, analitice și Facebook Pixel local, imagini de încărcare leneșe + videoclipuri, curățarea bazelor de date, preîncărcare, controlul bătăilor inimii și integrarea atât a Cloudflare cât și a mai multor CDN-uri. Cu alte plugin-uri de memorie cache (din moment ce majoritatea nu au aceste funcții), va trebui să instalați 6-7 pluginuri suplimentare pentru a obține aceste optimizări de viteză atunci când sunt încorporate în WP Rocket.

6. Eliminați scripturile externe

Scripturile externe sunt orice pot atrage solicitări de pe site-urile externe.

Fonturile Google pot fi combinate într-un fișier. Videoclipurile pot fi încărcate leneș și iframe se înlocuiesc cu o imagine de previzualizare. Multe scripturi pot fi optimizate, altele nu. Mai jos sunt câteva exemple.

  • Fonturi Google: combinați fonturi și găzduiți-le local folosind pluginuri precum WP Rocket, Autoptimize, OMGF, Google Font-Hosted Fonts și Asset CleanUp.
  • Google Analytics: cod de urmărire gazdă local în WP Rocket / CAOS Analytics.
  • Google AdSense: încărcați în mod asincron și încercați Cloudflare Rocket Loader.
  • Hărți Google: faceți o fotografie a hărții Google și includeți un link către indicațiile de conducere atunci când oamenii fac clic pe imagine (aceasta arată la fel de bine ca o hartă)!
  • Managerul de etichete Google: de obicei face mai mult rău decât bine atunci când încercați să combinați mai multe scripturi. Trebuie utilizat numai pentru site-uri mari, neautorizate.
  • Videoclipuri încorporate: folosiți WP Rocket sau WP YouTube Lyte pentru a încărca videoclipuri leneșe și înlocuiți iframe cu o imagine de previzualizare (videoclipurile sunt un element foarte greu).
  • Widgets încorporate + postări: luați capturi de ecran în loc să le încorporați.
  • Facebook Pixel: WP Rocket poate adăuga memoria cache a browserului pe Facebook Pixel.
  • Gravatars: nimic nu a funcționat pentru mine, în afară de a dezactiva Gravatars (WP Rocket nu le folosește nici pe blogul lor). Dar, puteți încerca Harrys, FV sau Optimum Gravatar Cache sau puteți încerca să spargeți sau să ascundeți comentarii expandabile.
  • Plugin-uri de partajare socială: generați în mod infam solicitări de la Facebook, Twitter și rețelele de socializare pentru a reîmprospăta numerele. Încercați un plugin mai rapid de genul Pug social, Mashsharer, Social SnapAddToAny, Partajare socială WP, sau Partajare socială ușoară

7. Combinați fonturile Google

Fonturile Google pot fi combinate pentru a genera o cerere în loc de mai multe cereri.

Google-Fonturi-GTmetrix

Următoarele pluginuri au opțiuni pentru optimizarea fonturilor Google:

  • Racheta WP
  • CleanUp de active
  • Autoptimize
  • OMGF

Totuși, cea mai bună metodă este să găzduiești Google Fonts la nivel local. Aceasta presupune descărcarea fonturilor dvs. direct de pe site-ul Fonturi Google, în timp ce este minim cu numărul de fonturi și greutatea fontului. Apoi, utilizați un instrument de genul Transfonter sau convertiți fonturile în fișiere cu fonturi web. Vei încărca apoi noile fișiere de font web în folderul wp-content / upload, vei adăuga fontul personalizat în CSS și vei testa fontul pentru a te asigura că funcționează. Din nou, vedeți linkul pentru un tutorial complet.

Transfonter-Google-Font-conversie

7. Minimizați HTML, CSS, JavaScript

Minimizarea fișierelor se face de obicei prin pluginul cache (vezi pasul 1).

Dar uneori, acest lucru vă poate rupe site-ul. În acest caz, ar trebui să testați fiecare setare una câte una, să verificați fișierele problematice din codul sursă, apoi să excludeți aceste fișiere din minificare folosind pluginul cache. Dacă nu vedeți erori vizibile, nu trebuie să faceți acest lucru.

8. Optimizarea livrării CSS

Acest lucru ar trebui să remedieze resurse de blocare a redării articol din PageSpeed ​​Insights.

WP Rocket, Autoptimize și alte pluginuri similare ar trebui să aibă o opțiune pentru a optimiza livrarea CSS. Pur și simplu accesați setările și asigurați-vă că aveți această opțiune activată și ar trebui să o rezolve.

Optimizarea livrării CSS

9. Amânarea / încărcarea fișierelor JavaScript combinate asincron

JavaScript asincron înseamnă încărcarea fișierelor după pagina sa terminat de descărcat.

Acest lucru se poate face folosind WP Rocket sau Async JavaScript și ar trebui să remedieze eliminați elementul Javascript care blochează redarea. Async JavaScript vă oferă controlul complet la care scripturi să adăugați un atribut „async” sau „amânare”, în timp ce WP Rocket deferează JavaScript cu 1 clic.

Fișiere JavaScript

10. Videoclipuri de încărcare leneșă

Videoclipurile încorporate sunt resurse externe care generează solicitări HTTP.

Pot dura 2+ secunde să se încarce! În timp ce nu le puteți elimina complet, puteți întârzie încărcarea videoclipurilor până când utilizatorii defilează în jos (încărcare leneșă) și faceți clic pe butonul de redare (încorporare ușoară).

Aveți câteva opțiuni aici: puteți utiliza WP Rocket pentru a permite încărcarea leneșă și înlocuiți iframe YouTube cu imaginea de previzualizare. Dar dacă nu aveți WP Rocket, puteți încerca WP YouTube Lyte plugin sau urmează asta tutorial despre încărcături YouTube ușoare. Ambele funcționează bine.

Iată un exemplu (și un video excelent pe Speed ​​WordPress):

11. Adăugați un CDN

CDN-urile pot ajuta la crearea mai puține solicitări HTTP.

În loc să faceți ca serverul dvs. de origine să răspundă la o solicitare, centrele de date ale unui CDN vor descărca lățimea de bandă în timp ce vor lumina sarcina pe serverul de origine. Cloudflare este gratuit, așa că este un brain-brainer.

CDN-uri multiple = mai multe centre de date = livrare mai rapidă de conținut și mai multă descărcare de resurse. Mulți oameni încep cu Cloudflare, apoi în cele din urmă se uită la StackPath când folosesc mai multe CDN-uri (le folosesc în prezent pe ambele). KeyCDN este de asemenea bun. Aceasta se numește „lanț” de CDN-uri.

Configurarea mai multor CDN-uri
Cu Cloudflare, acestea vă alocă 2 numere de schimb pe care le schimbați în registrul dvs. de domeniu. Cu alte CDN-uri precum StackPath și KeyCDN, acestea vă atribuie o adresă URL CDN pe care o veți lipi în câmpul URL CDN din plugin-ul dvs. de memorie cache (majoritatea îl au) sau utilizează CDN Enabler.

CDN-uri multiple

12. Minimizează redirecționările

Redirecțiile inutile pot provoca solicitări HTTP suplimentare.

Va trebui să vă uitați la raportul dvs. GTmetrix pentru a vedea care este cauza acestei erori. Este generat de un script sau plugin extern pe site-ul dvs.? Ați încercat să optimizați scriptul respectiv sau să căutați un plugin mai ușor? Se datorează faptului că v-ați modificat versiunea de domeniu în non-WWW sau HTTPS, dar nu ați actualizat toate linkurile / imaginile de pe site-ul dvs. pentru a reflecta noua versiune?

Minimizați erorile de redirecționare

Cauze comune

  • Plugin-uri greșite
  • Scripturi externe
  • S-a schimbat la WWW vs. Non-WWW, dar nu au fost actualizate link-uri
  • Modificat la HTTPS vs non-HTTPS, dar nu au actualizat link-uri

13. Optimizarea imaginilor

Pentru a reduce solicitările HTTP cauzate de imagini, există trei moduri principale de a optimiza imaginile:

Serviți imagini la scară largă: redimensionați imaginile mari pentru a fi mai mici. GTmetrix vă spune ce imagini sunt prea mari și dimensiunile corecte la care trebuie decupate / redimensionate. Încercați să creați o foaie de înșelare a dimensiunilor imaginii, măsurând dimensiunile glisierelor dvs., imaginile blogului cu lățime completă, widget-urile și alte zone ale site-ului dvs. web. Apoi asigurați-vă că redimensionați imaginile la dimensiunile corecte înainte de a le încărca. Dacă faceți acest lucru, nu ar fi trebuit să difuzați niciodată erori de imagine reduse.

Optimizarea imaginilor (compresie fără pierderi): utilizați un plugin precum ShortPixel (recomandat), Smush sau Imagify pentru a comprima imaginile. Deși aceste plugin-uri spun fără pierderi, puteți observa uneori o mică pierdere a calității. Acesta este motivul pentru care este mai bine să faceți backup pentru imaginile dvs. și să le testați câteva înainte de a optimiza în mod masiv toate imaginile de pe site-ul dvs. web, pentru a vă asigura că sunteți mulțumit de calitatea.

Specificați dimensiunile imaginii: adăugați o lățime + înălțime la HTML sau CSS al imaginii. Acest lucru se face automat în editorul vizual, dar nu HTML personalizat, unii construitori de pagini și, eventual, alte zone ale site-ului dvs. WordPress. GTmetrix vă va arăta ce imagini au aceste erori și vă vor oferi dimensiunile corecte. Pentru a remedia eroarea, va trebui să localizați imaginea în tabloul de bord WordPress, să editați HTML sau CSS, apoi să adăugați lățimea + înălțimea.

Încă trebuie să faceți mai puține solicitări HTTP?

Dacă mai aveți nevoie de ajutor, lăsați-mi un comentariu. WordPress Accelerarea grupului Facebook este de asemenea util sau ne puteți angaja pentru servicii de viteză WordPress cu înainte + după rapoartele GTmetrix.

WordPress Accelerarea grupului Facebook

întrebări frecvente

&# X1f680; Ce cauzează solicitări HTTP?

Cererile HTTP sunt orice creează o solicitare către server (de exemplu, o singură imagine creează 1 cerere). Fila Cascadă GTmetrix vă oferă toate solicitările de încărcare pe o pagină.

&# X1f680; Care sunt cele 5 lucruri pe care le puteți reduce pentru solicitările HTTP?

5 lucruri ușoare pe care le puteți face sunt să combinați fișiere CSS + JavaScript, să încărcați imagini și videoclipuri leneșe, să evitați lista noastră de plugin-uri cu procesor ridicat, să dezactivați selectiv pluginurile din anumite pagini / postări cu Perfmatters sau Asset CleanUp și să vă optimizați fonturile.

&# X1f680; Un plugin cache va ajuta la reducerea cererilor HTTP?

Da, un plugin de cache bun ar trebui să ajute la minificarea și la combinarea fișierelor, precum și la reducerea cererilor HTTP atunci când sunt configurate corect. Am tutoriale pentru aproape fiecare plugin de cache.

&# X1f680; Fixarea altor articole GTmetrix va reduce solicitările HTTP?

Da, în multe cazuri, va reduce mai ales și combină fișierele, va elimina erorile de redirecționare și folosirea unui CDN poate ajuta și.

&# X1f680; Ce plugin de cache reduce cel mai mult cererile HTTP și cum să îl configurezi?

Recomand WP Rocket care a fost clasat pe locul 1 în majoritatea sondajelor de pe Facebook și are mai multe caracteristici de optimizare a vitezei decât majoritatea plugin-urilor din cache, motiv pentru care obține, de obicei, scoruri și timpi de încărcare în GTmetrix. Vezi tutorialul meu despre configurarea setărilor WP Rocket.

Multumesc pentru citit :)

Noroc,
Tom

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