Käivitasite testi GTmetrixis ja seal see punaselt kirjas on: „Add Expires Headers". Tuttav vaatepilt. Sait on WordPressis, majutus Apache’il ja kiirustest nõuab, et seadistaksite brauseri vahemälu mõne .htaccessi faili kaudu.

Viga ei ole kriitiline, aga on tüütu. Ilma Expires-päisteta laadib brauser iga külastusega pilte, CSS-i ja skripte serverist uuesti alla. Korduvalt. Isegi kui midagi pole muutunud. Kiirus langeb, kasutajad ootavad, Google langetab kohti.

Saate selle viie minutiga parandada. Kaks meetodit: käsitsi koodiga.htaccessis või pistikprogrammiga kahe klõpsuga. Allpool mõlemad koos valmiskoodi ja seadistustega.

💡 Kiirülevaade:

• Saage aru, kuidas Expires- ja Cache-Control-päised brauseri vahemälu haldavad
• Lisage valmiskood.htaccessi: kopeerige, kleepige, kontrollige
• Paigaldage AEH Speed Optimizationi pistikprogramm ühe minutiga, kui te ei soovi koodi puutuda
• Seadistage optimaalsed vahemällu salvestamise perioodid piltidele, CSS-ile, JS-ile ja fontidele

Kuidas Expires-päised töötavad

Kui külastaja saidile satub, laadib brauser alla kümneid faile: HTML-leht, CSS-stiilid, JavaScript, fondid, ikoonid, pildid. Iga fail on eraldi HTTP-päring serverisse. Mida rohkem päringuid, seda pikem laadimisaeg.

Expires-päis ütleb brauserile: „see fail ei muutu, salvesta see vahemällu ja ära küsi uuesti enne sellist-ja-sellist kuupäeva." Korduvkülastustel tõmbab brauser failid kohalikust vahemälust, selle asemel et neid uuesti serverist küsida. Tulemus: kümneid päringuid vähem ja kiire laadimine.

Kaasaegne vaste on Cache-Control-päis koos max-age-direktiiviga. See määrab vahemälu eluea sekundites, mitte konkreetse kuupäeva, ja seda peetakse nüüd esmaseks. Soovitame seadistada mõlemad päised korraga: Expires vanadele brauseritele ja puhverserveritele, Cache-Control kõigele kaasaegsele. Mõlemad kirjutatakse samasse.htaccessi plokki.

Meetod 1: kood.htaccessis

Kõige otsesem tee on lisada vahemällu salvestamise reeglid otse Apache’i seadistusfaili. .htaccess-fail asub saidi juurkataloogis (samas kohas, kus wp-config.php). Kui te seda ei näe, lubage peidetud failide kuvamine oma FTP-kliendis või majutuse failihalduris.

Enne muutmist laadige failist koopia oma arvutisse. Süntaksiviga.htaccessis võib saidi 500 veaga kokku jooksutada, varukoopia võimaldab sekundiga tagasi võtta.

Avage .htaccess redaktoris ja lisage järgmine plokk enne rida # BEGIN WordPress:

1
    # Browser caching: Expires and Cache-Control headers
2
<IfModule mod_expires.c>
3
    ExpiresActive On
4
 
5
    # Images
6
    ExpiresByType image/jpg "access plus 1 year"
7
    ExpiresByType image/jpeg "access plus 1 year"
8
    ExpiresByType image/gif "access plus 1 year"
9
    ExpiresByType image/png "access plus 1 year"
10
    ExpiresByType image/webp "access plus 1 year"
11
    ExpiresByType image/avif "access plus 1 year"
12
    ExpiresByType image/svg+xml "access plus 1 year"
13
    ExpiresByType image/x-icon "access plus 1 year"
14
 
15
    # CSS and JavaScript
16
    ExpiresByType text/css "access plus 1 month"
17
    ExpiresByType application/javascript "access plus 1 month"
18
 
19
    # Fonts
20
    ExpiresByType font/woff2 "access plus 1 year"
21
    ExpiresByType font/woff "access plus 1 year"
22
 
23
    # PDF and other documents
24
    ExpiresByType application/pdf "access plus 1 month"
25
 
26
    # Default
27
    ExpiresDefault "access plus 2 days"
28
</IfModule>
29
 
30
    # Cache-Control headers for modern browsers
31
<IfModule mod_headers.c>
32
    &lt;FilesMatch &quot;\.(jpg|jpeg|png|gif|webp|avif|svg|ico|woff2|woff)$&quot;&gt;
33
        Header set Cache-Control "max-age=31536000, public"
34
    </FilesMatch>
35
    &lt;FilesMatch &quot;\.(css|js)$&quot;&gt;
36
        Header set Cache-Control "max-age=2592000, public"
37
    </FilesMatch>
38
</IfModule>

Mis siin toimub. Esimene plokk <IfModule mod_expires.c> aktiveerib Expires-mooduli ja määrab salvestusperioodid igale failitüübile. Üks aasta piltidele ja fontidele, need peaaegu kunagi ei muutu. Üks kuu CSS-ile ja JavaScriptile, neid uuendatakse perioodiliselt.

Teine plokk <IfModule mod_headers.c> lisab kaasaegse Cache-Control-i samade perioodidega, kuid sekundites: 31536000 = üks aasta, 2592000 = üks kuu.

Oluline: mod_expires ja mod_headers moodulid peavad olema serveris lubatud. Enamikus Apache’i majutustes on need vaikimisi aktiivsed: tugi lubab need esmase seadistuse käigus. Kui vahemällu salvestamine pärast salvestamist ei tööta, kirjutage majutuse toele: „lubage mod_expires ja mod_headers."

Pärast kleepimist salvestage fail ja laadige see tagasi saidi juurkataloogi. Avage sait brauseris, minge DevToolsi (F12) → Network → värskendage lehte. Klõpsake ükskõik millisel CSS- või JS-failil, Headers-kaardil peaksite nägema Expires ja Cache-Control nullist erinevate väärtustega.

Käivitage GTmetrix uuesti, viga peaks kadunud olema.

Meetod 2: AEH Speed Optimizationi pistikprogramm

Kui te ei soovi käsitsi.htaccessi süveneda, on olemas pistikprogramm. Varem kandis see lihtsalt nime Add Expires Headers, tänaseks on see kasvanud AEH Speed Optimizationiks. Lisaks vahemälu päistele suudab see teha CSS-i minifitseerimist, piltide laisa laadimist ja tihendamist.

Paigaldamise sammud:

• Plugins → Add New, otsingusse sisestage „AEH Speed Optimization"

• Klõpsake Install Now, seejärel Activate

• Minge Settings → AEH Speed Optimization

• Cache Settings kaardil märkige failitüübid ja määrake salvestusperioodid päevades

• Klõpsake Submit

Pistikprogramm kirjutab ise reeglid.htaccessi, te ei pea ühtegi koodirida kirjutama. Enamiku saitide jaoks piisab tasuta versioonist. Pro-versioon lisab Gzip-tihenduse, väliste ressursside (Google’i fondid, CDN-skriptid) vahemällu salvestamise ja kohandatud failitüübid.

🔗 AEH Speed Optimization WordPress.org-is

Kui teil on juba mõni vahemälu pistikprogramm nagu W3 Total Cache või WP Rocket, ei vaja te eraldi Expires-pistikprogrammi. Iga tõsiseltvõetav vahemälu pistikprogramm oskab automaatselt lisada Expires- ja Cache-Control-päiseid.htaccessi. Minge oma pistikprogrammi seadetesse ja kontrollige, et Browser Cache kaart oleks aktiivne.

Millist vahemällu salvestamise aega määrata

Universaalset vastust pole, periood sõltub sellest, kui sageli te konkreetset failitüüpi muudate.

Üldreegel: mida stabiilsem fail, seda pikem periood. Piltide puhul on üks aasta standardne. CSS-i ja JS-i puhul on üks kuu mõistlik kompromiss kiiruse ja värskuse vahel.

Kui arendate saiti aktiivselt ja stiilid muutuvad iga nädal, seadke CSS-ile üks nädal, mitte kuu. Kui muudatused on lõpetatud, pöörduge tagasi ühe kuu juurde.

⁉️🤔 Levinud küsimused

Lisasin koodi.htaccessi, kuid GTmetrix näitab endiselt viga. Miks?

Kõige levinum põhjus on see, et mod_expires või mod_headers moodulid pole serveris lubatud. Kirjutage majutuse toele palvega mõlemad moodulid aktiveerida. Teine põhjus: sisestasite koodi pärast # BEGIN WordPress-i, mitte enne seda. WordPress kirjutab üle kõik, mis tuleb pärast tema markerit. Kolmandaks, mõni vahemälu pistikprogramm (W3 Total Cache, WP Rocket) juba haldab.htaccessi ja kirjutas teie reeglid oma reeglitega üle. Sel juhul seadistage Browser Cache pistikprogrammi enda sees, mitte käsitsi.

Mis vahe on Expiresil ja Cache-Controlil?

Expires määrab konkreetse kuupäeva ja kellaaja („kehtiv kuni 15. juuni 2027"). Cache-Control koos max-age-direktiiviga määrab kestuse sekundites päringu hetkest („kehtiv 31536000 sekundit"). Cache-Control on paindlikum ja omab prioriteeti: kui mõlemad on määratud, järgib brauser Cache-Control-i. Soovitame kirjutada mõlemad maksimaalse ühilduvuse tagamiseks nii vanade kui ka uute klientidega.

Sait on Nginxil,.htaccess ei tööta. Mida teha?

.htaccess-fail on Apache’i seadistus. Nginx ignoreerib seda. Nginxi puhul lisatakse vahemällu salvestamise reeglid saidi seadistusfaili server-sektsiooni expires-direktiiviga. Kui teil on Nginx (majutused nagu Kinsta, Cloudways), kasutage AEH Speed Optimizationi pistikprogrammi: see töötab igal veebiserveril, sest haldab päiseid PHP kaudu, mitte serveri seadistuse kaudu.

Kas ma pean Expiresit seadistama, kui kasutan juba CDN-i?

Jah. CDN (Cloudflare, BunnyCDN) salvestab sisu oma serverites üle maailma, kuid brauseri vahemälu on eraldi kiht. Korralikult seadistatud Expires ja Cache-Control vähendavad päringuid isegi CDN-i: brauser ei lähe faili järele üldse võrku, kui selle kohalik koopia on endiselt värske. Kaks vahemälu kihti, CDN + brauser, töötavad koos, mitte ei asenda teineteist.

Kas AEH Speed Optimizationi pistikprogramm läheb minu vahemälu pistikprogrammiga vastuollu?

Võib minna, kui mõlemad üritavad.htaccessi reegleid kirjutada. Enne AEH Speed Optimizationi paigaldamist keelake oma peamises vahemälu pistikprogrammis Browser Cache või vastupidi, hoidke alles üks pistikprogramm, mis haldab nii lehe vahemälu kui ka brauseri vahemälu. WP Rocket ja W3 Total Cache suudavad kõike kohe karbist välja võttes teha, eraldi Expires-pistikprogrammi pole nendega vaja.

Kas peaksite Expiresi käsitsi seadistama või piisab pistikprogrammist?

Kui töötate enesekindlalt FTP-ga ja ei karda koodiredaktorit, annab käsitsi seadistamine.htaccessi kaudu täieliku kontrolli ega lisa administraatorisse täiendavat pistikprogrammi. Ülaltoodud kood: kopeerige, kleepige ja küsimus on lahendatud.

Kõigile teistele lahendab AEH Speed Optimizationi pistikprogramm ülesande ilma trükivea riskita seadistusfailis. Lisaks pakub see minifitseerimist ja laiska laadimist, mis samuti kiirendavad saiti.

Peamine on mitte jätta GTmetrixi viga nii nagu ta on. Viis minutit Expires-päiste seadistamiseks annab märgatava kiiruse tõusu ja kiirus on nii kasutajakogemus kui ka otsingureitingud.