Tehnička optimizacija web shopa

Detalji o projektu

Kategorija:

Dizajner:

Kad je web shop spor, to je gotovo kao da ulazite u fizičku trgovinu s kamenim vratima koja ne možete lako otvoriti. Zašto biste se i trudili, kad odmah pored te trgovine imate još jednu s vratima koja se lako otvaraju. Otprilike tako je izgledao slučaj s radnaodjeca.hr, web shopom specijaliziranim za prodaju radne odjeće, zaštitne opreme i srodnih proizvoda.

Ova studija slučaja tehničke optimizacije web shopa sažima ključne korake, implementirane promjene i postignute rezultate tehničke optimizacije. Cilj je bio učiniti stranicu bržom radi povećanja konverzija te postaviti kvalitetne temelje za daljnju SEO optimizaciju.

Tehnička optimizacija web shopa

Prije optimizacije, web shop se suočavao s nekoliko tehničkih problema koji su dramatično usporavali učitavanje. Prosječno vrijeme učitavanja naslovnice bilo je dugih 5 sekundi, što je predugo za bilo kakvu web stranicu, a pogotovo za web shop čiji bi cilj trebao biti omogućiti kupcu jednostavnu i brzu kupovinu.

Snimka zaslona performansi web shopa prije tehničke optimizacije
Performanse web shopa prije tehničke optimizacije
Snimka zaslona performansi web shopa poslije tehničke optimizacije
Performanse web shopa poslije tehničke optimizacije

Kako sam ubrzao učitavanje web shopa Radna odjeća?

Predmemoriranje (Browser cache i server-side cache)

Ipak, unatoč nekim nedostacima, ovaj web shop je solidno izrađen, što znači da nema (puno) grešaka u kodu, a implementacijom browser i server-side cache sustava riješena je većina problema s performansama web shopa.

U ovom konkretnom slučaju, za implementaciju cache-a koristio sam najbolji cache plugin – WP Rocket. Uz postavljanje nekoliko naprednih pravila za cachiranje, uklanjanje nepotrebnog CSS-a, odgađanje učitavanja i izvršavanja JavaScripta, te reduciranje aktivnosti WordPress Heartbeata i druge postavke, uspješno sam ubrzao učitavanje na prihvatljivih 2.5 sekunde.

Međutim, na sporijim vezama ponekad to učitavanje može biti i duže, a budući da sam s cache pluginom tek bio na početku zadatka, daljna tehnička optimizacija web shopa rezultirala je vrlo dobrim rezultatima.

Object Cache

Za povećanje brzine učitavanja web stranice nije dovoljan samo cache plugin koji će stvarati i posluživati predmemorirane HTML verzije stranica. Kombinacija s Object Cache sustavom poput Redisa idealna je kombinacija za maksimalan uspjeh tehničke optimizacije.

Radnaodjeca.hr smještena je Njemačkom Hetzner hostingu – to je vrlo dobar hosting koji je čak nadmašio i moja očekivanja – i to je jedan od uvjeta za postizanje dobrih performansi stranice – kvalitetan hosting.

Hetzner omogućuje Redis cache, jedan od najboljih sustava za predmemoriranje objekata koji smanjuje opterećenje baze podataka smanjujući upite prema bazi svaki put kad korisnik posjećuje web stranicu.

Omogućivanjem Redis Object cachea, kompresijom slika te još nekim prilagodbama unutar WordPress teme, smanjio sam potpunu brzinu učitavanja (LCP) na 1.7 sekundi i općenito poboljšao sve metrike performansi web shopa, kako je vidljivo u snimkama zaslona iznad.

Zaključak

Spor web shop je isto kao i da ga nemate, jer kupci su danas nestrpljivi. Ako im se Vaša online trgovina ne otvara odmah oni odlaze, stoga je svako učitavanje iznad 3 sekunde neprihvatljivo za poslovanje.

Tehnička optimizacija web shopa može riješiti problem sporog učitavanja, što direktno utječe na poboljšanje korisničkog iskustva kupaca i konverzije. Ona je temelj koji moramo postaviti prije SEO optimizacije jer je brzina učitavanja preduvijet za dobro rangiranje u tražilicama.

Ako je i Vaš web shop spor, kontaktirajte h1 design i zatražite uslugu tehničke optimizacije web shopa.

Podijelite sadržaj!