Optimizacija brzine Shopify prodavnica
14th Jul 2025
6 min čitanja
Kratki vodič u 5 koraka za omogućavanje, podešavanje, testiranje i upravljanje browser keširanjem na Shopify Plus radi veće brzine i boljeg UX-a.
Keširanje pretraživača u Shopify Plus pomaže vašoj prodavnici da se brže učitava čuvajući statične fajlove poput slika, CSS-a i JavaScript-a na uređajima korisnika. Ovo smanjuje broj zahteva ka serveru, ubrzava učitavanje stranice i poboljšava korisničko iskustvo. Iako Shopify Plus uključuje osnovno keširanje, prilagođavanje može dodatno unaprediti performanse. Evo kako da to postavite:
theme.liquid
i dodajte keš meta tagove u sekciju <head>
.Cache-Control
heder-e da definišete vreme isteka keša za različite fajlove.Tip resursa | Trajanje keša |
---|---|
Slike | 30 dana |
CSS fajlovi | 7 dana |
JavaScript fajlovi | 1–7 dana |
Slike proizvoda | 14 dana |
Redovno pratite performanse vaše prodavnice i po potrebi prilagođavajte keš podešavanja. Za složenija rešenja, konsultujte Shopify Plus stručnjake za prilagođena rešenja.
Počnite prijavom u vaš Shopify Admin dashboard koristeći administratorske kredencijale. Ovo će vam omogućiti da izvršite potrebne izmene.
U levom meniju izaberite Online Store. Zatim kliknite na Preferences da biste otvorili sekciju za podešavanja keširanja pretraživača.
Skrolujte naniže unutar Preferences sekcije dok ne pronađete opcije za keširanje pretraživača [1]. Ostavite otvoren Admin panel jer će vam biti potreban za naredne korake.
Pronađite fajl theme.liquid
u strukturi vaše teme. Tu ćete dodati neophodnu konfiguraciju za keširanje.
Da biste postavili keširanje pretraživača, otvorite fajl theme.liquid
u vašoj aktivnoj temi. Pronađite tag <head>
i dodajte sledeći kod:
<meta http-equiv="Expires" content="30" />
Ovaj snippeta kaže pretraživačima da čuvaju statične resurse vaše prodavnice – poput slika, CSS-a i JavaScript fajlova – 30 dana. Ovo pomaže smanjenju ponovljenih zahteva ka serveru i ubrzava učitavanje stranice [3]. Ne zaboravite da kliknete „Save“ da biste primenili izmene.
Koristite Chrome DevTools da potvrdite da je keširanje aktivno. Otvorite Network tab, osvežite sajt i proverite kolone „Size“ i „Time“. Obratite pažnju na:
Kada je keširanje na mestu, možete preći na prilagođavanje podešavanja za još bolje performanse.
Kada omogućite keširanje, sledeći korak je da fino podesite parametre kako biste unapredili performanse, a da istovremeno zadržite ažurnost sadržaja.
Koristite Cache-Control
heder-e u theme.liquid
da definišete koliko dugo statični resursi ostaju u kešu. Evo kratkog vodiča:
Tip resursa | Trajanje keša |
---|---|
Slike | 30 dana |
CSS fajlovi | 7 dana |
JavaScript fajlovi | 1–7 dana |
Slike proizvoda | 14 dana |
Možete implementirati ova trajanja pomoću sledećeg koda:
<!-- Za slike -->
<FilesMatch "\.(jpg|jpeg|png|gif)$">
Header set Cache-Control "max-age=2592000, public"
</FilesMatch>
<!-- Za CSS i JS -->
<FilesMatch "\.(css|js)$">
Header set Cache-Control "max-age=604800, public"
</FilesMatch>
Za dinamičke resurse, koristite verzionisanje da balansirate performanse i ažurnost sadržaja. Evo primera:
<link rel="stylesheet" href="style.css?v=1.2">
<script src="main.js?v=1.3">
Kada ažurirate resurs, samo promenite broj verzije (npr. v=1.3
) da biste osigurali da korisnici dobiju ažurirani fajl, a da zadrže keš za ostale resurse.
Ako vaša prodavnica ima složenije zahteve, Shopify Plus stručnjaci mogu implementirati napredne keš strategije. Oni mogu postaviti dinamička pravila, upravljati procesima invalidacije i fino podesiti parametre prema specifičnim potrebama vaše prodavnice.
Takođe možete koristiti Chrome DevTools za proveru keš hedera i datuma isteka, kako biste bili sigurni da sve funkcioniše kako treba.
Nakon optimizacije, testirajte i pratite uticaj na performanse vaše prodavnice da biste uočili moguće prilike za poboljšanje.
Nakon što ste podesili keširanje, vreme je da potvrdiš da sve radi kako treba i da pratiš performanse.
Počni sa Chrome DevTools (F12 > Network tab) da pregledaš heder-e poput Cache-Control
i Expires
. Oni pokazuju da li su podešavanja primenjena ispravno:
Cache-Control
: Proveri da li max-age
odražava tvoje podešavanje.Expires
: Uveri se da datumi isteka odgovaraju podešavanju.Za dublju analizu, alati poput Google PageSpeed Insights i GTmetrix su neprocenjivi. Oni mogu identifikovati probleme, izmeriti vreme učitavanja resursa i dati konkretne preporuke za poboljšanje.
Uspostavi rutinu za praćenje kako tvoj keš funkcioniše:
Dobar cilj je da barem 85% resursa bude posluženo iz keša. Ako ne postižeš taj nivo ili primećuješ usporenja, možda je vreme za pomoć Shopify Plus stručnjaka.
Kada potvrdiš da keš podešavanja dobro rade, sledeći korak je da naučiš kada i kako da očistiš keš da sve ostane optimizovano. O tome u narednoj sekciji.
Čišćenje keša može pomoći da tvoja Shopify Plus prodavnica radi besprekorno. Evo ključnih trenutaka kada bi to trebao da uradiš:
Koristi ove prečice za čišćenje keša u pregledaču:
Pregledač | Prečica |
---|---|
Chrome | Ctrl + Shift + Delete (Windows) / Command + Shift + Delete (Mac) |
Firefox | Ctrl + Shift + Delete |
Safari | Command + Option + E |
Keš teme
Da osvežiš temu, koristi prečice (Ctrl + F5 na Windows-u, Command + Shift + R na Mac-u) ili napravi malu izmenu u temi da pokreneš reset. Nakon čišćenja, proveri podešavanja da sve izgleda ispravno.
Keš aplikacija
Svaka aplikacija može imati sopstveni način keširanja. Pogledaj dokumentaciju aplikacije za konkretna uputstva. Mnoge aplikacije imaju opcije za upravljanje kešem u svojim podešavanjima.
Napravite redovan raspored za čišćenje keša u zavisnosti od ažuriranja vaše prodavnice. Ako naiđete na složene probleme sa keširanjem, Shopify Plus stručnjaci mogu ponuditi prilagođena rešenja za optimizaciju performansi.
Čišćenjem keša osiguravate da vaša prodavnica ostane brza, responzivna i spremna da pruži odlično iskustvo korisnicima.
Keširanje pretraživača pomaže da sajt brže učitava statične resurse kao što su slike i skripte, čime se poboljšava iskustvo korisnika i SEO, zahvaljujući kraćem vremenu učitavanja. Međutim, da biste zadržali ove prednosti, morate redovno pregledati i ažurirati strategiju keširanja [4].
Efikasno upravljanje kešem zahteva dosledne provere. Alati poput Google PageSpeed Insights i GTmetrix mogu vam pomoći da pratite brzinu sajta i osigurate da strategija keširanja radi kako treba [1].
Zadatak | Učestalost | Svrha |
---|---|---|
Testiranje i pregled keša | Nedeljno/Mesečno | Praćenje brzine sajta i performansi |
Potpuna evaluacija keša | Kvartalno | Analiza i rafiniranje strategija |
Ako vaša prodavnica koristi prilagođene teme ili ima puno third-party integracija, upravljanje keširanjem može biti izazovno. U tim slučajevima, angažovanje profesionalaca može uštedeti vreme i osigurati besprekornu funkcionalnost.
Na primer, Codersy je specijalizovan za rešenja keširanja u Shopify Plus, nudeći prilagođene usluge za optimizaciju performansi [2]. Njihovo iskustvo može biti od velike vrednosti za prodavnice sa jedinstvenim konfiguracijama.
Da biste postavili keširanje u Shopify Plus, odite u Admin panel na Online Store > Themes. Izmenite fajl theme.liquid
dodavanjem keš meta tagova unutar <head>
. Nakon izmena, koristite alate za razvoj u pregledaču da potvrdite ispravnost. Pogledajte Korak 2 za detaljno uputstvo.
Keširanje pretraživača poboljšava performanse vaše prodavnice čuvajući statične resurse lokalno na uređajima korisnika. Ovo smanjuje brojeve zahteva i ubrzava učitavanje stranice. Alati poput Google PageSpeed Insights mogu meriti ove izboljšane performanse.
Važno je redovno pregledati i prilagođavati keš podešavanja. Evo predloženog rasporeda:
Treba da očistite keš u situacijama poput:
Ako vaša prodavnica ima složenu strukturu ili prilagođenu temu, angažovanje tehničkog stručnjaka je dobra ideja. Oni mogu fino da podešavaju keš i osiguraju besprekornu integraciju sa third-party aplikacijama.
Za dublje savete o keširanju i optimizaciji performansi, vratite se na prethodne korake ili se konsultujte sa Shopify Plus stručnjacima.