Cum să accelerezi un site web de director sau piață creat cu HivePress

În zilele noastre, viteza de încărcare a site-ului web și performanța generală sunt cruciale pentru o experiență bună a utilizatorului și pentru clasamentele în motoarele de căutare. Recent, Google a anunțat că va începe să măsoare Core Web Vitals, cum ar fi scorurile de stabilitate vizuală și timpii de încărcare a paginii, pentru site-uri web pentru a determina dacă se vor califica pentru o creștere a semnalului de clasare. De asemenea, paginile cu un timp de încărcare mai lung tind să aibă rate de respingere mai mari și un timp mediu mai mic pe pagină.

În acest tutorial, vă vom explica cum să creșteți vertiginos performanța site-ului dvs. prin configurarea memoriei cache, optimizarea stilurilor și scripturilor, precum și optimizarea conținutului media. Vom folosi pluginul LiteSpeed ​​Cache, o soluție all-in-one de accelerare a site-ului web, cu o mulțime de instrumente și funcții pentru ca site-ul dvs. să fie rapid.

În scopuri de testare, vom folosi un site web director WordPress construit cu HivePress și câteva extensii împreună cu tema sa implicită ListingHive. Cu toate acestea, dacă site-ul dvs. nu este construit cu pluginul HivePress, puteți urma aceiași pași pentru orice alt site web alimentat de WordPress.

Deci, să începem cu instalarea LiteSpeed ​​Cache.

Instalarea LiteSpeed ​​Cache

În primul rând, trebuie să instalați pluginul LiteSpeed ​​Cache. O puteți face cu ușurință direct din tabloul de bord WordPress, accesând secțiunea Plugin-uri > Adăugați nou . Găsiți-l prin bara de căutare și continuați instalându-l. Când instalarea este terminată, faceți clic pe butonul „Activare” pentru a activa pluginul.

Odată ce este instalat și activat, puteți începe să vă optimizați site-ul. Să trecem mai întâi prin setările de bază ale memoriei cache.

Optimizare cache

Pentru a ajusta setările de bază ale memoriei cache, navigați la pagina LiteSpeed ​​Cache > Cache . Există multe secțiuni diferite în această pagină, dar vom trece doar prin cele mai importante setări.

Setări cache

Aici, vă recomandăm cu căldură să dezactivați memoria cache pentru utilizatorii conectați și solicitările API REST. Acest lucru este necesar pentru ca pluginul HivePress să funcționeze corect. După ce activați sau dezactivați orice opțiune, nu uitați să salvați modificările.

Cache de obiecte

Apoi, să activăm Object Cache . Navigați la secțiunea Obiect și verificați dacă memoria cache a obiectelor este disponibilă pe site-ul dvs. Testul de conectare ar trebui să fie afișat ca „trecut”. Dacă da, puteți activa memoria cache a obiectelor, iar acest lucru va îmbunătăți drastic performanța site-ului web prin memorarea în cache a interogărilor duplicate ale bazei de date.

Nu ar trebui să existe probleme la trecerea testului de conectare dacă site-ul dvs. se bazează pe serverul OpenLiteSpeed ​​sau furnizorul dvs. de găzduire acceptă stocarea în cache a obiectelor.

Cache de browser

În cele din urmă, navigați la secțiunea Browser Cache și asigurați-vă că este activată. Aceasta va stoca în cache tot conținutul static, cum ar fi stilurile, scripturile și imaginile din browserul utilizatorului.

Optimizarea paginii

Următorul pas este să navigați la secțiunea LiteSpeed ​​Cache > Optimizare pagină pentru a optimiza stilurile, scripturile și fonturile.

Optimizare CSS

Să începem cu secțiunea Setări CSS . Aici vă recomandăm să activați setările CSS Minify și CSS Combine .

• CSS Minimizare – Dacă activați această opțiune, toate caracterele suplimentare de spațiu alb, caracterele de linie nouă și alte date inutile sau redundante vor fi eliminate automat din fișierele CSS fără a afecta stilurile site-ului web.
• CSS Combine – Prin activarea acestuia, toate fișierele CSS individuale vor fi îmbinate într-un singur fișier CSS. În acest fel, browserul trimite o singură cerere de fișier în loc să solicite fiecare fișier CSS separat, reducând numărul de solicitări HTTP.

Optimizarea fonturilor

Dacă site-ul dvs. folosește Fonturi Google, există câteva opțiuni pentru optimizarea încărcării fonturilor. În aceeași secțiune Setări CSS , puteți derula în jos și puteți seta opțiunea Optimizare afișare fonturi la Schimbare , astfel încât fontul alternativ să fie folosit pentru a afișa textul până când fontul personalizat este descărcat complet.

Odată ce setați opțiunea Schimbare , mergeți la secțiunea Optimizare din aceeași pagină și activați opțiunea Încărcare fonturi Google asincron pentru a încărca fonturi Google în fundal în timp ce pagina este redată.

Optimizare JS

Acum să mergem la secțiunea Setări JS pentru a optimiza fișierele JavaScript. Aici vă recomandăm să urmați aceiași pași ca și pentru setările CSS. Pur și simplu activați opțiunile JS Minify și JS Combine , astfel încât fișierele JS să fie, de asemenea, reduse și îmbinate într-un singur fișier.

Există, de asemenea, opțiunea Load JS Deferred care poate face cu adevărat diferența. După ce activați această setare, scripturile se vor încărca în fundal, în timp ce browserul redă aspectul și stilurile paginii. Scripturile sunt adesea „mai grele” decât HTML, astfel încât încărcarea și execuția scripturilor care nu sunt necesare pentru redarea paginii inițiale pot fi amânate și încărcate ulterior. Permite vizitatorilor să folosească site-ul aproape imediat.

După ce bifați această opțiune, asigurați-vă că front-end-ul site-ului web nu este întrerupt deoarece unele scripturi pot necesita încărcare înainte ca pagina să fie redată.

Optimizare media

În cele din urmă, trebuie să vă optimizați conținutul media. Deoarece imaginile reprezintă adesea aproximativ jumătate din dimensiunea conținutului unei pagini web, conversia tuturor imaginilor în format WebP (care este în medie cu 30% mai mic decât alte formate) poate îmbunătăți semnificativ viteza de încărcare a paginii.

În secțiunea LiteSpeed ​​Cache > Optimizare imagine > Setări , puteți converti imaginile site-ului dvs. în format WebP activând setările Creare versiuni WebP și Înlocuire imagine WebP .

După ce verificați aceste opțiuni, navigați la secțiunea Rezumatul optimizării imaginii pentru a obține cheia de domeniu și a optimiza imaginile făcând clic pe butonul „Trimiteți cererea de optimizare” până când scorul de optimizare a imaginii ajunge la 100%.

De asemenea, dacă există încorporare pe site-ul dvs. web (de exemplu, videoclipuri YouTube, postări Instagram sau Tweeturi), este mai bine să încărcați conținutul încorporat numai atunci când utilizatorii derulează în jos la acesta, nu în timpul redării paginii inițiale. Aceasta va face ca prima pagină să fie afișată mult mai rapid și va reduce utilizarea memoriei browserului.

Navigați la secțiunea LiteSpeed ​​Cache > Optimizare pagină > Setări media și activați opțiunea Lazy Load Iframes .

Încheierea

Mai jos este o captură de ecran a rezultatelor Google PageSpeed ​​pe dispozitive mobile și desktop după ce am optimizat performanța site-ului urmând pașii din acest tutorial.

Asta e! Dacă v-ați construit directorul sau site-ul de piață cu HivePress (sau orice altă soluție bazată pe WordPress) , puteți urma aceiași pași pentru a configura stocarea în cache, a optimiza stilurile, scripturile și fonturile, precum și conținutul media, cum ar fi imagini sau încorporare. Ca rezultat, veți obține un scor mare la Google PageSpeed ​​(îmbunătățindu-vă astfel clasamentul SEO) și veți îmbunătăți experiența generală a utilizatorului site-ului dvs.

În plus, nu ezitați să verificați următoarele articole:

• Cele mai bune pluginuri pentru directoare WordPress
• Teme populare de directoare WordPress
• Greșeli la crearea unui site web cu listare WordPress