Activem memoria cache a browserului din partea utilizatorului. Plugin WordPress Super Cache, utilizați memoria cache a browserului Utilizați memoria cache a browserului pentru fișiere individuale
"" pentru a optimiza site-ul conform sfatului instrumentului de la Viteza paginii Google Perspective. Fiecare proprietar de site-uri web s-a confruntat cu problema dificultății de stocare în cache a scripturilor js ale site-urilor terțe.
Acesta nu este un indicator atât de important pentru optimizare, de fapt, elementele CSS și JS sunt transferate din antetul site-ului în subsol, în plus, dacă te uiți la resursele Google, au probleme cu acest punct :)
Dacă tot doriți să vă optimizați site-ul web sau clienții prin memorarea în cache a scripturilor terță parte, de exemplu. Dacă observați un număr frumos pe contorul din analizor, atunci trebuie doar să urmați pașii de mai jos, care vor dura câteva minute.
Cacheul browserului cu elementele sale
Realizarea unui cache pentru diferite scripturi, exemplu preluat de pe blogul Devaka ru (la momentul scrierii)
De exemplu:
/assets/copyright.min.js (nu a fost specificată data de expirare)
/assets/i/566.jpg (nu a fost specificată data de expirare)
/assets/i/icons.png (nu a fost specificată data de expirare)
/i/postcomm-left.png (nu a fost specificată data de expirare)
/i/postcomm-right.png (nu a fost specificată data de expirare)
Pentru a remedia prima problemă, accesați fișierul .htaccess, care se află la rădăcina site-ului și introduceți acest cod în partea de jos:
# text de compresie, html, javascript, css, xml:
Exemple de scripturi terțe
Dacă ați făcut totul corect în primul pas, ar trebui să vedeți ceva de genul acesta:
Utilizați memoria cache a browserului pentru următoarele resurse
Desigur, este posibil să aveți doar câteva adrese URL pentru valori și analize, de exemplu, dar acest lucru nu este atât de important, instrucțiunile de corecție sunt aceleași pentru toată lumea.
Cache de elemente terțe
Inițial, articolul trebuia să fie dedicat doar acestor puncte, dar simțind că vor fi multe întrebări, au mai fost adăugate câteva puncte.
Nu există nicio modalitate de a influența timpul de cache al unei resurse terță parte, dar o puteți face pe proiectul dvs. web Cea mai corectă mișcare în această situație este descărcarea automată a celor mai recente scripturi pentru valori, analize etc. pe site-ul dvs. folosind cron (script prezent)
Să punem lucrurile în ordine acum!
Pasul 1. Copiați lista tuturor scripturilor către care Google PageSpeed a indicat într-un bloc de note sau direct din browser.
Pasul 2. Creați un fișier pe hosting cu extensia php și inserați următorul cod în el:
Atenţie! Nu aveți permisiunea de a vizualiza text ascuns.
Există 3 în cod, de exemplu, dar puteți crea câte articole aveți nevoie, doar copiați și adăugați mai jos sau ștergeți-le pe cele inutile.
În această linie schimbăm a 3-a valoare:
Utilizați browserul cache pentru Google PageSpeed
1. Scriptul pe care îl vom încărca pe site-ul nostru web
Atenţie! Nu aveți permisiunea de a vizualiza text ascuns.
2. Calea unde să salvezi fișierul:
Realpath("./js")
În acest exemplu, este folderul js, adică calea exactă va fi www.site/js/ (trebuie să creați singur folderul și să îl setați la drepturi CHMOD pentru inregistrare)
3. Numele scriptului, dacă cu extensia .js, atunci îl scriem împreună cu acesta, dacă fără el sau cu altceva, atunci facem totul ca în exemplul de mai sus. Vă rugăm să fiți atenți că nu există fișiere cu același nume.
Pasul 3. Încărcați fișierul editat pe server
Pasul 4. Plasați fișierul pe cron pentru actualizare automată fişiere
Pentru a evita munca incorectă cu serviciile, dacă acestea fac modificări la scripturi, cron se va autentifica automat și le va actualiza pe serverul său.
Accesați panoul de găzduire și selectați fila CRON și introduceți comanda și, de asemenea, specificați ora o dată pe oră/zi sau în orice alt moment.
Wget -q -O - /dev/null http://www..php >/dev/null 2>&1
Nu uitați să schimbați adresa URL și poate că sintaxa comenzii dvs. va fi diferită, uitați-vă la exemple de comenzi cron în ajutorul pentru găzduire sau contactați asistența tehnică.
Pasul 5. Schimbați calea către JS în contor sau script
Dacă a existat o cale în contorul https://mc.yandex.ru/metrika/watch.js, atunci înlocuiți-o cu o cale în interiorul site-ului, de exemplu http://www..js
Asta e, acum pe listă PageSpeed Insights Nu ar trebui să aveți mesaje despre setarea memoriei cache a browserului.
Descărcați instrucțiunile „Activați memoria cache a browserului pentru Google PageSpeed” din arhivă Nu puteți descărca fișiere de pe serverul nostru
Vă prezentăm un articol util „Activați cache-ul browserului pentru Google PageSpeed” pentru a vă optimiza site-ul la sfatul unui instrument de la Google PageSpeed - tot ce e mai bun avem forumuri, hack-uri, module, șabloane.
Instrucțiunea funcționează numai dacă apache procesează fișiere statice (instalate ca interfață). Dacă nginx este în fața lui, aceleași acțiuni trebuie efectuate într-un mod complet diferit.
În primul rând, câteva cuvinte pe această temă - de ce este necesară stocarea în cache a resurselor site-ului web (imagini, css, fișiere html, arhive și alte fișiere statice)?
De fiecare dată când un vizitator vă deschide site-ul, nu numai codul html al paginii este descărcat, ci și toate fișierele însoțitoare care sunt necesare pentru proiectarea paginii (imagini, stiluri css, scripturi js și așa mai departe).
Ca rezultat, o deschidere a unei pagini de fișier nu este o cerere către server, ci de la zece la sute! Fiecare astfel de solicitare nu este doar o încărcare pe server (ceea ce este important), ci și un timp suplimentar pentru utilizator pentru a încărca pagina (care este important ca indicator al calității site-ului și al ușurinței utilizatorului de a lucra cu acesta) .
De exemplu, popularul serviciu de verificare a site-ului de la Google PageSpeed Insights scrie întotdeauna un avertisment despre acest lucru:
Utilizați memoria cache a browserului
Specificând o dată sau o dată de expirare pentru resursele statice în antetele HTTP, browserul va încărca resursele preluate anterior de pe discul local și nu de pe Internet.
Utilizați memoria cache a browserului pentru următoarele resurse://— lista fișierelor cu probleme —//
Activarea stocării în cache nu numai că reduce încărcarea pe server (aproape toate paginile site-ului au elemente de design duplicat, scripturi java etc.) atunci când utilizatorul vizitează din nou site-ul/pagina, dar reduce și timpul de încărcare a paginii de partea sa. Deoarece browserul preia fișierele din cache aproape cu viteza fulgerului, utilizatorul are senzația că pagina s-a încărcat aproape cu viteza fulgerului!
Pentru a rezolva această problemă, creați un fișier în folderul site-ului cu numele .htaccess(cu un punct la început. Acest lucru este important!) și adăugați aceste reguli. Dacă fișierul există deja, adăugați la sfârșitul celui existent:
# stocarea în cache în browser din partea utilizatorului
După aceasta, puteți verifica rezultatul la pagina Google PageSpeed Insights (dacă totul este corect - mesajul „ Utilizați memoria cache a browserului„ va fi marcat cu verde și plasat în secțiunea „Reguli completate: (mai multe detalii)”)
Nu merge, ce ar trebui să fac?
Dacă memorarea în cache nu funcționează, atunci trebuie să verificați dacă modulele sunt instalate. Pentru a face acest lucru, trebuie să creați un fișier în folderul site-ului test.php cu cod:
Dacă mod_expires sau mod_headers nu sunt în listă, rulați pe rând următoarele comenzi în consola serverului (conectat) ( aceasta va instala/activa mod_expires, mod_headers):
Antetele A2enmod a2enmod expiră serviciul apache2 restart
Dacă site-ul este pe găzduire obișnuită, atunci totul este mai complicat. Contactați asistența tehnică și aflați de ce modulele nu sunt instalate și cum puteți rezolva această problemă. Deoarece pot exista destul de multe motive pentru care hosterul nu a instalat modulele.
👁9 325 de vizualizări.
În acest articol vom continua să analizăm cum puteți accelera încărcarea site-ului. Am discutat mai devreme. Astăzi vom învăța cum să activăm cache-ul browserului din partea utilizatorului folosind fișierul .htaccess.
De ce să activați memoria cache a browserului din partea utilizatorului
Adesea, atunci când creează un site web nou, programatorii nu acordă prea multă atenție vitezei cu care site-ul se încarcă în browser. Mai ales dacă acest punct nu a fost concentrat în Termenii de referință pentru dezvoltarea site-ului. Și după lansarea unei noi creații, un specialist web care este implicat în dezvoltarea și promovarea acestui proiect poate observa o imagine foarte tristă prin scanarea site-ului pentru viteza de încărcare în PageSpeed Insights de la Google.
Departe de asta lista completa probleme pe care le putem întâlni și care încetinesc viteza de încărcare a site-ului din partea browserului utilizatorului:
Unii dintre cititori s-ar putea întreba, de ce exact trebuie să activați acest cache și să accelerați viteza de încărcare a site-ului? La urma urmei, site-ul oricum nu funcționează prost.
Există cel puțin două motive pentru aceasta:
- Dacă site-ul durează mult să se încarce, atunci utilizatorul s-ar putea să nu aștepte super-efectele tale, destinate de designer să atragă atenția, ci pur și simplu va închide opera ta de artă și pur și simplu va merge pe site-ul unui concurent, poate mai puțin colorat, dar mai rapid și mai receptiv. La urma urmei, nimănui dintre noi nu-i place să aștepte mult timp. 🙂
- Cu cât viteza de încărcare a site-ului este mai mare, cu atât va fi deservită mai mică. motoarele de căutare De interogări cheie, în raport cu site-urile concurenților dvs. Și aceasta este deja o amenințare semnificativă pentru dezvoltarea afacerii dvs.
Cum să activați memoria cache a fișierelor în browser din partea utilizatorului
Dacă proiectul dvs. este dezvoltat pe un popular CMS WordPress, adică există multe plugin-uri care pot rezolva problema de cache. Cele mai populare dintre ele sunt W3 Total Cache, WP Super Cache, Hyper Cache. Dar în acest articol îmi propun să iau în considerare o modalitate mai fiabilă, după părerea mea, de a activa stocarea în cache prin fișierul .htaccess direct pe găzduire.
Vă rugăm să rețineți, că metodele propuse vor funcționa numai dacă software-ul Apache este instalat pe serverul furnizorului dvs. de găzduire.
Înainte de a face orice modificareîn fișierul .htaccess asigurați-vă că îl faceți copie de rezervă pe computer, astfel încât să îl puteți restaura dacă ceva nu merge bine.
Pentru a activa cache-ul browserului din partea utilizatorului, Este suficient să folosiți una dintre metodele de mai jos. Utilizarea ambelor metode în același timp nu este recomandabilă și poate duce la perturbarea site-ului dvs.
Activarea memoriei cache a browserului din partea utilizatorului folosind modulul mod_headers
Pentru a activa funcția de cache, codul de mai jos trebuie inserat în fișierul .htaccess, care se află în directorul rădăcină al site-ului dvs. Pentru a evita erorile, trebuie să inserați codul înainte de linia # END WordPress:
# Activarea memoriei cache în browserele vizitatorilor site-ului < ifModule mod_headers . c > # Toate fișierele html și htm vor fi stocate în memoria cache a browserului timp de 12 ore < FilesMatch "\.(html|htm)$" > Cache set antet - Control „max-age=43200” < / FilesMatch > # Toate fișierele css, javascript și text vor fi stocate în memoria cache a browserului timp de 7 zile < FilesMatch "\.(js|css|txt)$" > Cache set antet - Control „max-age=604800” < / FilesMatch > # Toate fișierele flash și imaginile vor fi stocate în memoria cache a browserului timp de 31 de zile < FilesMatch „\.(flv|swf|ico|gif|jpg|jpeg|png)$”> Cache set antet - Control „max-age=2592000” < / FilesMatch > # Dezactivează stocarea în cache a fișierelor php și a altor servicii < FilesMatch „\.(pl|php|cgi|spl|scgi|fcgi)$”> Antet dezactivat Cache - Control < / FilesMatch > < / IfModule > |
Nu voi descrie ce înseamnă aceste directive sau alte directive. Mai multe detalii despre valorile lor pot fi găsite pe site-ul oficial de documentație Apache.
Activarea memoriei cache a browserului din partea utilizatorului folosind modulul mod_expires
Pentru a activa stocarea în cache în browser din partea utilizatorului utilizând modulul mod_expires, scrieți următorul cod în fișierul .htaccess:
< ifModule mod_expires . c > Expiră activ pe #cache-ul implicit este de 30 de secunde Expiră implicit „acces plus 30 de secunde” # Activați memoria cache a imaginilor și flash-ul timp de 1 lună Imagine ExpiresByType / x - pictograma „acces plus 1 lună” ExpiresByType imagine/jpeg „acces plus 4 săptămâni” Imagine ExpiresByType / png „acces plus 30 de zile” ExpiresByType imagine/gif „acces plus 43829 minute” Aplicația ExpiresByType / x - shockwave - flash „acces plus 2592000 secunde” # Activați stocarea în cache a fișierelor css, javascript și text timp de 7 zile ExpiresByType text/css „acces plus 604800 secunde” ExpiresByType text/javascript „acces plus 604800 secunde” Aplicația ExpiresByType/javascript „acces plus 604800 secunde” |
img class=”aligncenter wp-image-2458 size-full” title=”Cum se activează stocarea în cache a paginilor site-ului” src=”http://about-windows.ru/wp-content/uploads/2014/07/How pentru a activa -browser-caching-of-site-pages.jpg” alt=”Cum se activează stocarea în cache a paginilor site-ului” width=”600″ height=”450″ />
Cum pot activa memoria cache a browserului utilizatorului final pe site-ul meu?
Dacă serverul dvs. informează browserul utilizatorului final că unele resurse pot fi stocate în , atunci o solicitare repetată pentru aceleași resurse va primi un răspuns nu de la serverul la distanță, ci de la computerul local. Ambele părți vor beneficia de acest lucru. Astfel, serverul va ușura o parte din încărcare, deoarece nu va trebui să trimită anumite resurse care sunt deja disponibile pe computerul utilizatorului. Dar utilizatorul va primi mai mult acces rapid la resursele solicitate.
Cum se activează stocarea în cache a resurselor site-ului pe un server Apache?
Mai întâi, să ne dăm seama ce resurse ar trebui să memoreze browserul în cache. Permiteți-mi să vă reamintesc că, dacă browserul memorează în cache unele resurse, este posibil să nu le actualizeze complet pentru o lungă perioadă de timp. Această situație este destul de potrivită pentru obiecte statice. Ce resurse pot fi clasificate ca obiecte statice?
- fișiere CSS.
- fișiere JS.
- Imagini.
- Video.
- Muzică.
Resursele de mai sus, precum și alte resurse, pot fi stocate în cache pentru o lungă perioadă de timp, fără a fi afectate. Ele nu vor fi actualizate în fiecare zi. Pe baza acestui lucru, vă voi oferi un cod care va forța browserul utilizatorului să memoreze în cache resursele enumerate. În plus, vom indica perioada în care aceste resurse pot fi stocate în cache fără a solicita actualizări.
Expiră activ pe
Expiră implicit „acces 7 zile”
Aplicația ExpiresByType/javascript „acces plus 1 an”
ExpiresByType text/javascript „acces plus 1 an”
ExpiresByType text/css „acces plus 1 an”
ExpiresByType text/html „acces plus 7 zile”
ExpiresByType text/x-javascript „acces 1 an”
ExpiresByType imagine/gif „acces plus 1 an”
ExpiresByType imagine/jpeg „acces plus 1 an”
ExpiresByType imagine/png „acces plus 1 an”
ExpiresByType imagine/jpg „acces plus 1 an”
ExpiresByType imagine/pictogramă x „acces 1 an”
Aplicația ExpiresByType/x-shockwave-flash „acces 1 an”
Acest cod trebuie introdus în fișier .htaccess, care se află în folderul rădăcină al site-ului pentru care Apache servește ca server. După aceasta, browserul va stoca în cache toate obiectele de mai sus pentru perioada specificată. Aceasta înseamnă că, dacă vizitați același site în decurs de un an (după cum este indicat în exemplu), veți primi multe fișiere de pe computer, cu excepția cazului în care, desigur, ați șters memoria cache a computerului în acest timp.
- htaccess caching salvează conținutul unei pagini web în calculator local când utilizatorul îl vizitează;
- Utilizarea cache-ului browserului – webmasterul instruiește browserele cum să trateze resursele.
Când browserul redă o pagină web, trebuie să încarce sigla, fișierul CSS și alte resurse:
Cache-ul browserului „îți amintește” resursele pe care browserul le-a descărcat deja. Când un vizitator merge pe o altă pagină de pe site, logo, fișiere CSS etc. nu ar trebui să fie descărcate din nou deoarece browserul le-a „rememorat” deja (le-a salvat). Acesta este motivul pentru care pagina web durează mai mult să se încarce la prima vizită decât la vizitele repetate.
Când utilizați memoria cache, fișierele paginii web vor fi stocate în memoria cache a browserului. Paginile se vor încărca mult mai repede la vizitele repetate. Se va întâmpla și cu alte pagini care folosesc aceleași resurse.
Cum să activați memoria cache a browserului
- Modificați anteturile cererii de resurse pentru a utiliza stocarea în cache;
- Optimizați-vă strategia de stocare în cache.
Modificarea antetelor cererii
Pentru majoritatea oamenilor, singura modalitate de a stoca în cache htaccess-ul unui site este să adăugați cod la fișierul .htaccess de pe serverul web.
Fișierul .htaccess controlează multe setări importante pentru site-ul dvs.
Memorarea în cache a browserului prin fișierul .htaccess
Codul de mai jos îi spune browserului ce să memoreze în cache și cât timp să-l „amintească”. Ar trebui adăugat la începutul fișierului .htaccess:
## EXPIRĂ CACHING-ul ##
Salvați fișierul .htaccess și apoi reîmprospătați pagina web.
Cum să setați timpul de cache pentru diferite tipuri de fișiere
Codul de mai sus specifică intervale de timp. De exemplu, 1 an (1 an) sau 1 lună (1 lună). Sunt legate de tipurile de fișiere. Codul de mai sus prevede că fișierele .jpg (imaginile) ar trebui să fie stocate în cache timp de un an.
Dacă doriți să schimbați acest lucru, astfel încât imaginile JPG să fie și ele stocate în cache pentru o lună, atunci ați înlocui pur și simplu „1 an” cu „1 lună”. Valorile de cache htaccess de mai sus sunt optime pentru majoritatea paginilor web.
Metodă alternativă de stocare în cache pentru .htaccess
Metoda descrisă mai sus se numește „ Expiră„, îi ajută pe majoritatea începătorilor cu memorarea în cache. Odată ce vă simțiți confortabil cu memorarea în cache, puteți încerca o altă metodă de stocare în cache numită Cache-Control, care vă oferă mai multe opțiuni.
Este posibil ca metoda Expires să nu funcționeze pe serverul dvs., caz în care ar putea dori să încercați să utilizați Cache-Control.
Cache-Control
Această metodă vă permite să obțineți mai mult control asupra stocării în cache a paginii în browser, dar multor persoane le este mai ușor să specifice toate setările o dată.
Exemplu de utilizare într-un fișier .htaccess:
#1 lună pentru majoritatea activelor statice
Codul de mai sus setează antetul Cache-Control în funcție de tipul fișierului.
Cum funcționează Cache-Control?
Luați în considerare linia de mai sus a codului de stocare în cache în browserul htaccess:
#1 lună pentru majoritatea activelor statice
Această linie este doar o notă. Fișierul .htaccess ignoră liniile care încep cu caracterul #. Această notă este recomandată deoarece este posibil să aveți mai multe seturi de date diferite ca soluție de stocare în cache a fișierelor:
Linia menționată mai sus spune că „ dacă fișierul este unul dintre aceste tipuri, atunci vom face ceva cu el...»
Cel mai important lucru la această linie este că listează diverse tipuri fisiere ( CSS, JS, JPEG, PNG etc. ) și că instrucțiunile de stocare în cache ar trebui aplicate acestor tipuri de fișiere. De exemplu, dacă nu doriți ca fișierele JPG să fie stocate în cache pentru o anumită perioadă de timp, puteți elimina „ JPG". Dacă doriți să adăugați HTML, atunci trebuie să indicați în această linie „ HTML«:
Set antet Cache-Control „max-age=2592000, public”
Linia menționată mai sus stabilește anteturile și valorile reale:
- Partea " Setul antet Cache-Control» — stabilește titlul;
- variabila " varsta maxima=2592000„—indică cât timp va dura procesul de stocare în cache (în secunde). În acest caz, păstrăm în cache timp de o lună (2592000) secunde;
- Partea " public» raportează că este disponibil public.
