Predmemoriranje (caching)

Modul 6: Brzina · Vrijeme čitanja: 9 minuta

Cilj učenja: Nakon ove lekcije moći ćete objasniti koje vrste predmemorije (cache) postoje te ispravno postaviti i provjeriti predmemoriju stranice (page cache).

Ključni pojmovi: predmemorija stranice (page cache), predmemorija preglednika (browser cache), Cache-Control, predmemorija objekata (object cache), Redis, OPcache, CDN, dodatak za predmemoriju (cache plugin), LiteSpeed Cache, iznimke (prijavljeni korisnici, košarica, naplata), pražnjenje predmemorije, dvostruki dodaci za predmemoriju

Predmemorija (cache): ne radite isti posao dvaput

Predmemorija (cache) čuva rezultat obavljenog posla, tako da ga sljedeći put ne treba ponavljati. Na WordPress web-stranici postoje četiri mjesta na kojima se to događa, od najvećeg prema najmanjem:

Predmemorija stranice (page cache)

Lekcija 1.2 pokazala je to: bez predmemorije WordPress pri svakom posjetu iznova izrađuje cijelu stranicu. S predmemorijom stranice prvi posjetitelj je izrađuje, a svi sljedeći dobivaju spremljeni HTML. TTFB od sekunde tako može pasti na nekoliko stotinki sekunde, a Vaš paket može podnijeti mnogo više istodobnih posjetitelja.

Kako ćete dobiti predmemoriju stranice, ovisi o Vašem web-poslužitelju:

• LiteSpeed (mnogi dijeljeni hosting paketi, uključujući WebOké): sam web-poslužitelj ima vlastitu predmemoriju. Besplatni dodatak LiteSpeed Cache upravlja njome iz WordPressa: koje stranice smiju biti u predmemoriji, kada se prazne. Budući da se predmemorija nalazi u samom web-poslužitelju, PHP se uopće ne pokreće za spremljenu stranicu.
• Apache ili nginx: dodatak za predmemoriju koji HTML sprema kao datoteke, poput WP Super Cache, W3 Total Cache ili plaćenog dodatka poput WP Rocket. Ili predmemorija koju hosting provider uređuje na razini poslužitelja.
• Upravljani WordPress hosting često ima vlastitu predmemoriju; u tom slučaju obično ne instalirate dodatak za predmemoriju.

Odaberite jedan. Dva dodatka za predmemoriju istodobno (primjerice LiteSpeed Cache i WP Rocket) ometaju jedan drugoga: dvostruki posao, stranice koje se ne prazne, čudne greške. Na LiteSpeed poslužitelju LiteSpeed Cache surađuje s predmemorijom web-poslužitelja; drugi dodatak za predmemoriju to ne može.

Što ne smije biti u predmemoriji

Predmemorija stranice svima daje isti HTML. To ide pogrešno kod stranica koje se razlikuju po posjetitelju:

• prijavljeni korisnici (traka za administraciju, „Dobro došli, Lisa”);
• košarica, naplata i Moj račun kod web-trgovine;
• stranice s obrascem koji sadrži jednokratni kod (nonce), koji nakon određenog vremena istječe;
• stranice koje na temelju lokacije, jezika ili kolačića prikazuju nešto drukčije.

Dobri dodaci za predmemoriju automatski preskaču prijavljene korisnike i poznate WooCommerce stranice. Kod drugih dodataka (odjeljak za članove, sustav za rezervacije) morate sami postaviti iznimke. Znak da nešto nije u redu: posjetitelj vidi košaricu nekoga drugog, ili obrazac javlja „isteklo” ili „nevažeći zahtjev”.

Pražnjenje: kada je predmemorija zastarjela?

Kada izmijenite stranicu, spremljena verzija mora nestati. Dodaci za predmemoriju pri spremanju objave obično prazne tu stranicu, naslovnicu i arhive. Kod izmjene izbornika, teme ili widgeta često treba isprazniti cijelu predmemoriju. Vidite li nakon izmjene staru verziju, ispraznite predmemoriju (u traci za administraciju dodatka za predmemoriju) i provjerite u privatnom prozoru, kako vlastita predmemorija preglednika ne bi utjecala na rezultat.

Predmemorija preglednika (browser cache)

Poslužitelj zaglavljima javlja pregledniku koliko dugo smije čuvati datoteku:

cache-control: public, max-age=31536000

Ovo znači: čuvajte ovo godinu dana. Za stylesheet datoteke, skripte, fontove i slike dugo vrijeme je sasvim u redu, jer WordPress kod nove verzije iza adrese dodaje drukčiji ?ver=, pa ga preglednik tada vidi kao novu datoteku. Za sam HTML uobičajeno je kratko vrijeme (ili nikakvo), kako bi posjetitelji brzo vidjeli izmjene.

Mnogi hosting provideri i dodaci za predmemoriju to uređuju umjesto Vas. U zadatku ove lekcije to ćete provjeriti.

Predmemorija objekata (object cache) i Redis

Predmemorija stranice ne pomaže kod prijavljenih korisnika niti kod košarice. Tu pomaže predmemorija objekata: WordPress rezultat upita prema bazi podataka sprema u memoriju, u programu poput Redisa ili Memcacheda. Sljedeći put kada stigne isti upit, WordPress odgovor dohvaća iz memorije umjesto iz baze podataka.

To je korisno prvenstveno za web-trgovine, stranice za članove i web-stranice s mnogo prijavljenih urednika. Za običnu informativnu stranicu s predmemorijom stranice razlika je mala. Predmemorija objekata zahtijeva da Vaš hosting provider nudi Redis ili Memcached; nakon toga je uključujete dodatkom (LiteSpeed Cache to podržava, postoje i samostalni dodaci).

CDN

CDN (content delivery network, mreža za isporuku sadržaja) je mreža poslužitelja na mnogim mjestima u svijetu koji čuvaju kopije Vaših datoteka (a ponekad i cijele Vaše stranice). Posjetitelj ih dobiva s najbližeg poslužitelja. To najviše pomaže kod posjetitelja koji su daleko i kod velikog prometa. Za nizozemsku web-stranicu s nizozemskim posjetiteljima na nizozemskom poslužitelju dobitak je malen. CDN s proxyjem (poput Cloudflarea) mijenja i Vaš DNS i Vaš certifikat (DNS tečaj, lekcija 7.5); to nemojte raditi bez razumijevanja što to znači.

U praksi: ovako to izgleda u nadzornoj ploči

Kao primjer koristimo LiteSpeed Cache na LiteSpeed poslužitelju. Drugi dodaci za predmemoriju imaju slične postavke pod drugim nazivima.

1. Instalirajte i aktivirajte LiteSpeed Cache putem Dodaci (Plugins) > Dodaj novi.
2. Otvorite LiteSpeed Cache > Cache: „Omogući predmemoriju” je uključeno, „Predmemoriraj prijavljene korisnike” isključeno (osim ako znate što radite).
3. Kod web-trgovine: provjerite pod Izostavi da su košarica, naplata i Moj račun navedeni (kod WooCommercea to se događa automatski).
4. Ostale dijelove (optimizaciju CSS-a i JavaScripta, slika) najprije ostavite isključenima. Uključujte ih jedan po jedan i testirajte nakon svakog koraka: upravo ti dijelovi ponekad razbiju temu.
5. Provjerite u privatnom prozoru pomoću razvojnih alata (F12, Mreža (Network), prvi zahtjev): kod drugog učitavanja trebalo bi se pojaviti x-litespeed-cache: hit.

Sažetak

• Postoje četiri vrste predmemorije: stranice (najveći dobitak), preglednika, objekata i OPcache.
• Na LiteSpeed poslužitelju LiteSpeed Cache upravlja predmemorijom web-poslužitelja; na Apacheu ili nginxu koristite drugi dodatak za predmemoriju. Odaberite jedan.
• Prijavljeni korisnici, košarica, naplata i osobne stranice ne pripadaju u predmemoriju stranice.
• Ispraznite predmemoriju nakon izmjena izbornika ili teme i provjerite u privatnom prozoru.
• Predmemorija objekata (Redis) pomaže kod web-trgovina i prijavljenih korisnika; CDN prvenstveno kod udaljenih posjetitelja i velikog prometa.

Kviz

Zadatak

Zadatak A6.2: Radi li Vaš predmemorija stranica (page cache)? Unesite adresu Vaše web-stranice. Program dohvaća naslovnicu dva puta ubrzo nakon toga, bez kolačića, te kod drugog dohvaćanja provjerava zaglavlja koja ukazuju na pogodak u predmemoriji (x-litespeed-cache: hit, x-cache: HIT, cf-cache-status: HIT, vrijednost age veća od 0, ili zaglavlje neke druge poznate predmemorije). Zatim dohvaća jednu stylesheet datoteku s naslovnice i provjerava smije li je preglednik čuvati barem sedam dana (cache-control: max-age ili expires). Zabilježite koju predmemoriju koristite.

Dodatno čitanje

Ovi članci opisuju korake u nadzornim pločama WebOké; u drugim nadzornim pločama rade na sličan način.

• DirectAdmin priručnik 18.3: Moja web stranica je spora
• DirectAdmin priručnik 15.7: Redis
• Vaša web stranica je spora ili koristi previše CPU-a: evo kako je ubrzati
• OPcache: kašnjenje od 30 sekundi pri izmjeni PHP datoteke
• Je li gzip aktiviran u DirectAdminu i LiteSpeedu ili Apacheu?
• Predmemorija (cache) u WordPressu (developer.wordpress.org, engleski): https://developer.wordpress.org/advanced-administration/performance/cache/