Cum să activați memoria cache pe server. Activați memoria cache a browserului pentru Google PageSpeed
- Cache htaccess 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 cale memorarea în cache a unui site htaccess 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 active 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.
Această linie de cache htaccess închide instrucțiunea și încheie blocul de cod.
Problemă generală de cache
Dacă compilați o listă de imagini care vor fi stocate în cache timp de un an sau mai mult, rețineți că, dacă faceți modificări paginilor dvs., este posibil ca acestea să nu fie vizibile pentru toți utilizatorii. Deoarece utilizatorii vor accesa fișierele din cache, mai degrabă decât cele existente. Dacă există un fișier pe care îl editați periodic ( De exemplu - fișier CSS ), atunci puteți depăși problema cache-ului utilizând amprenta URL.
Amprenta URL
Devine nou (nu se poate stoca în cache) resursă fișier posibil în funcție de disponibilitate nume unic. De exemplu, dacă fișierul CSS este numit „main.css”, atunci l-am putea numi „main_1.css”. Data viitoare când îi schimbăm numele, putem numi fișierul „main_2.css”. Acest lucru este util pentru fișierele care se modifică periodic.
Lectură acest articol Veți învăța cum să eliminați ideea: utilizați memoria cache a browserului de la prietenul nostru PageSpeed Insights. Vom analiza problema folosind exemplul unui blog pe care îl cunosc.
Articolul este lung, îl voi arăta pe părți și voi introduce conținutul.
Folosim corect memoria cache a browserului și eliminăm problema „data de expirare nu este specificată”.
Uită-te (poza de mai jos) în cadrul marcat cu numărul 1, fișierele js sunt încărcate servicii terților, dar nu le puteți spune, hei, să activăm memorarea în cache a browserului pentru resursele dvs. Din păcate, în acest caz nu se poate face nimic, iar aceste reclamații nu pot fi înlăturate.
Acum să ne uităm la trei pași, care sunt după cum urmează:
Și iată primul tău sfat. Dacă este posibil, nu utilizați niciodată resurse externe pe site-urile dvs., acest lucru este foarte lent. Din moment ce majoritatea nu o fac servere proprii, atunci această problemă este relevantă. Aveam o uniformă feedback dintr-un portal, dar l-am eliminat, codul js a încetinit pagina, rămâne la latitudinea dvs. să decideți.
Trecând la caseta 2, există note pentru următoarele resurse, în principal css, js și imagini. Să ne dăm seama care este această perioadă de valabilitate. Cert este că atunci când un vizitator vizitează un site, browserul său descarcă fișiere pentru el însuși (știm deja acest lucru din definiția de mai sus). Pentru a ști cât timp să stocați aceste fișiere în memorie, trebuie să indicați acest timp.
Pasul 1. Descărcați .htaccess
Primul pas este să descărcați .htaccess, făcând totul rapid prin managerul FTP. În primul rând, va trebui să aflați pe ce rulează serverul dvs. sau, mai degrabă, software-ul acestuia. Ar trebui să fie Apache (95% rulează pe el, dar merită verificat).
Următoarele resurse nginx au parametri diferiți pentru activarea acestei funcție decât apache, așa că nu degeaba am spus să verific pe ce rulează site-ul.
Apoi, mergeți în directorul rădăcină al site-ului (prin FTP, eu folosesc FileZilla) în folderul pablic_html, unde se află întregul motor WordPress. Fișierul .htaccess este localizat în mod ideal aici, este standard de la Apache. Reglează încărcarea și accesul, dacă nu există, îl creăm. O vom lua în considerare în mai multe articole tematice, deocamdată trebuie să facem caching.
Pasul 2. Adăugați mod-header la fișier
Al doilea pas este să adăugați directive mod-header la .htaccess. Dacă există, atunci pur și simplu introduceți-l înainte de eticheta de închidere #endwordpress, acesta este codul.
Dacă este unul nou, atunci introduceți-l și plasați-l în directorul rădăcină.
# ÎNCEPE WordPress
Analiza liniilor de cod, de ce sunt responsabile
Acum trebuie să ne dăm seama de ce sunt responsabile toate aceste linii de cod. Totul este banal, se vede în rânduri diferite extensii png, jpg și altele asemenea, iar numerele sunt indicate vizavi de aceste extensii, acesta este fragmentul temporar în care vor fi stocate aceste fișiere. De exemplu, numărul 43200 indică faptul că fișierele acestor extensii vor fi păstrate în cache pentru o zi.
Dacă totul a fost făcut corect, atunci această linie va dispărea, dar putem face și mai bine, cum ar fi, citiți mai departe.
Plugin pentru stocarea în cache gravatars NIX Gravatar Cache
Pluginul nix gravatar cache este o mană divină pentru mine. Am mințit puțin când am spus că nu se poate scăpa de scripturile descărcate de la alte servicii. În lista de resurse externe puteți găsi un site gravatar, această condiție este declanșată dacă aveți comentarii la articol și le este atașat un gravatar. Destul de ciudat, aici puteți activa memoria cache a browserului WordPress pentru aceste imagini.
Sunt o persoană meticuloasă și, în sfârșit, am găsit o soluție, doar imaginea vine de acolo și, în consecință, poate fi stocată în cache și i se poate atașa o dată de expirare.
Am găsit o soluție în pluginul NIX Gravatar Cache, știu că acest lucru este rău, dar aproape că nu există nicio încărcare de la el. Recunosc, am încercat trei plugin-uri, dar numai acesta produce imagini în jpg, iar cele în formate necunoscute. Toate setările se reduc la două puncte, sunt afișate în captură de ecran.
Prima casetă de selectare este activată sau dezactivată, iar a doua este cât timp să stocați memoria cache. 
Care este toată distracția? Faptul este că vizitatorul își lasă comentariul, iar pluginul își descarcă automat gravatarul pe hosting și apoi încărcare nu de pe un site gravatar, asta-i tot. Asigurați-vă că îl instalați, deoarece un plugin este mai bun decât o sută de solicitări (cu condiția să aveți o sută de comentarii).
Memorăm în cache întregul site
Pentru a stoca în cache întregul site, aveți nevoie și de un plugin. În acest rol, am ales Hyper Cache, este ușor și nu necesită multe procese. Dar nu o voi lua în considerare acum, pentru că subiectul este foarte amplu și pur și simplu nu am suficiente articole. Rețineți ce trebuie instalat și cum să îl configurați, așteptați următorul articol.
Voi termina aici, ți-am actualizat complet memoria cache la maximum. ÎN în acest moment nu va fi în niciun pericol și site-ul dvs. se va încărca mult mai repede Citind acest articol, ați învățat cum să eliminați ideea: utilizați memoria cache a browserului de la prietenul nostru PageSpeed Insights.
Să rezumam ceea ce am învățat și care este procedura
- Am aflat pe ce rulează site-ul (apache, nginx etc.).
- Ați învățat cum să descărcați .htaccess pe computer.
- Am editat fișierul de acces.
- Am reușit să-l încărcăm înapoi pe server.
- Am instalat pluginul nix gravatar cache.
P.S. Dacă ceva nu merge, nu ezitați să scrieți un comentariu, voi răspunde și vă voi ajuta.
"" 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.
Nu este așa indicator important pentru optimizare, în esență, elementele CSS și JS sunt transferate din antetul site-ului în subsol, în plus, dacă te uiți la Resurse Google Au probleme cu acest punct :)
Dacă doriți totuși să vă optimizați site-ul web sau clienții prin memorarea în cache a scripturilor terță parte, de exemplu. observa frumos numar pe contorul din analizor, apoi 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 fost adăugate încă 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ă scenarii proaspete metrici, 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 găzduirea dvs. 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ă setați permisiunile de scriere CHMOD pentru el)
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ă rețineți că nu există fișiere cu aceleaș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 operare incorectă cu servicii, dacă fac modificări la scripturi, cron se va autentifica automat și le va actualiza pe serverul lor.
Accesați panoul dvs. 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 tot, acum nu ar trebui să vedeți niciun mesaj despre setarea cache-ului browserului în lista PageSpeed Insights.
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
Prezentarea articol util„Activați cache-ul browserului pentru Google PageSpeed” pentru a optimiza site-ul la sfatul instrumentului de la Google PageSpeed - tot ce e mai bun avem forumuri, hack-uri, module, șabloane.
Eric Bidelman
Traducere: Vlad Merzhevich
Accesibilitatea offline devine din ce în ce mai importantă pentru aplicațiile web. Da, toate browserele au mecanisme de stocare în cache, dar acestea nu sunt de încredere și nu funcționează întotdeauna așa cum era de așteptat. HTML5 elimină unele dintre aceste supărări cu interfața ApplicationCache.
Utilizarea unei interfețe cache oferă aplicației dvs. trei beneficii:
- navigare offline - utilizatorii vă pot explora întregul site atunci când sunt offline;
- viteza - resursele sunt stocate în cache local, astfel încât se încarcă mai repede;
- reducerea sarcinii pe server - browserul descarcă doar resurse modificate de pe server.
Cache-ul aplicației (sau AppCache) permite dezvoltatorului să specifice ce fișiere ar trebui să memoreze în cache browserul și să le pună la dispoziție utilizatorilor offline. Aplicația dvs. va funcționa corect chiar dacă utilizatorul face clic pe butonul „Actualizare” în timp ce este accesat modul offline.
Cache fișierul manifest
Fișierul manifest cache este simplu fișier text cu o listă de resurse pe care browserul ar trebui să le memoreze pentru acces offline.
Ajutor pentru fișierul manifest
Pentru a activa memoria cache a aplicației, includeți atributul manifest în etichetă .
...
Atributul manifest trebuie să fie pe fiecare pagină din aplicația pe care doriți să o păstrați în cache. Browserul nu memorează în cache o pagină decât dacă conține un atribut manifest (și dacă nu este listat în mod explicit în fișierul manifest). Aceasta înseamnă că orice pagină cu atributul manifest vizitată de utilizator va fi adăugată implicit în memoria cache a aplicației. În acest fel, nu este nevoie să enumerați toate paginile din manifest.
Atributul manifest specifică o adresă URL absolută sau relativă, dar cale absolută trebuie să fie în cadrul aceleiași aplicații web. Fișierul manifest poate avea orice extensie, dar trebuie să specificați tipul MIME corect (vezi mai jos).
...
Fișierul manifest trebuie să fie difuzat cu tipul MIME text/cache-manifest . Poate fi necesar să adăugați un tip de fișier personalizat pe serverul web sau prin setarea .htaccess. De exemplu, pentru a configura acest tip MIME în Apache, adăugați la fișierul de configurare:
AddType text/cache-manifest .appcache
Sau în fișierul app.yaml la Aplicația Google Motor:
Url: /mystaticdir/(.*\.appcache) static_files: mystaticdir/\1 mime_type: text/cache-manifest upload: mystaticdir/(.*\.appcache)
Structura fișierului manifest
Un manifest simplu ar putea arăta cam așa:
CACHE MANIFEST index.html stylesheet.css images/logo.png scripts/main.js
Acest exemplu memorează în cache cele patru fișiere specificate în manifest.
Câteva lucruri de reținut:
- linia CACHE MANIFEST trebuie să fie pe primul loc și este necesară;
- Datele de stocare în cache a site-ului sunt limitate la 5 MB. Cu toate acestea, dacă scrieți o aplicație pentru Magazinul web Chrome, utilizarea unlimitedStorage elimină această limitare;
- dacă fișierul manifest sau resursa specificată în acesta nu poate fi descărcată, întregul proces de actualizare a cache-ului va eșua, browserul va utiliza cache veche aplicatii.
Să ne uităm la un exemplu mai complex:
CACHE MANIFEST # 2010-06-18:v2 # Înregistrările principale memorate în cache în mod explicit CACHE: /favicon.ico index.html stylesheet.css images/logo.png scripts/main.js # Resurse de care utilizatorul va avea nevoie online NETWORK: login.php /myapi http://api.twitter.com # static.html va fi folosit dacă main.py nu este disponibil # offline.jpg va fi folosit în locul tuturor imaginilor din imagini/large/ # offline.html va fi folosit în locul tuturor fișierelor HTML FALLBACK: /main.py /static.html images/large/images/offline.jpg *.html /offline.html
Liniile care încep cu un hash (#) sunt comentarii, dar pot servi și unui alt scop. Cache-ul aplicației este actualizat numai atunci când fișierul manifest se modifică. De exemplu, la editarea imaginilor sau Funcții JavaScript, aceste modificări nu vor fi memorate din nou în cache. Trebuie să modificați fișierul manifest pentru a spune browserului să actualizeze fișierele din cache. Creați un comentariu cu numărul versiunii, suma de control sau data este o modalitate de a asigura utilizatorilor că folosesc ultima versiune. De asemenea, puteți actualiza cache-ul în mod programatic atunci când o nouă versiune este gata, așa cum este descris în secțiunea privind actualizarea memoriei cache.
Un manifest poate avea trei secțiuni diferite: CACHE, NETWORK și FALLBACK.
CACHE: Aceasta este secțiunea standard pentru înregistrare. Fișierele enumerate în acest bloc (sau imediat după MANIFESTUL CACHE) vor fi memorate în cache în mod explicit după ce sunt descărcate pentru prima dată.
NETWORK: Fișierele enumerate în această secțiune sunt resurse care necesită o conexiune la server. Toate solicitările către aceste resurse ocolesc memoria cache, chiar dacă utilizatorul este offline. Puteți utiliza * pentru a specifica un model.
FALLBACK: O secțiune suplimentară specifică paginile de rezervă dacă o resursă nu este disponibilă. Prima adresă URL este o resursă, a doua este o rezervă. Ambele adrese trebuie să fie relative și în aceeași locație cu fișierul manifest. Puteți utiliza * pentru a specifica un model.
Aceste secțiuni pot fi listate în orice ordine și fiecare secțiune poate apărea de mai multe ori.
Următorul manifest definește paginile „universale” (offline.html) care vor fi afișate atunci când un utilizator încearcă să acceseze rădăcina site-ului în timp ce este offline. De asemenea, se precizează că toate celelalte resurse (cum ar fi pe un site la distanță) necesită o conexiune la Internet.
MANIFESTUL CACHE # 2010-06-18:v3 # Intrările memorate în cache în mod explicit index.html css/style.css # offline.html vor fi afișate în modul offline FALLBACK: / /offline.html # Toate celelalte resurse (inclusiv site-urile) necesită o înregistrare online conexiune NETWORK: * # Resurse suplimentare în cache-ul CACHE: images/logo1.png images/logo2.png images/logo3.png
Fișierul HTML care face referire la fișierul manifest este memorat în cache automat. Nu este nevoie să îl includeți în manifest, dar vă recomandăm să faceți acest lucru.
Actualizare cache
Aplicația offline rămâne în cache până când apare una dintre următoarele:
- utilizatorul șterge stocarea datelor din browser pentru site-ul dvs.;
- Fișierul manifest s-a schimbat. Actualizarea unui fișier menționat în manifest nu înseamnă că browserul va re-cache resursa respectivă. Fișierul manifest în sine trebuie înlocuit;
- Cache-ul aplicației a fost actualizat programatic.
Stare cache
Obiectul window.applicationCache este al tău acces programaticîn memoria cache a browserului. Proprietatea status este folosită pentru a verifica starea curentă a memoriei cache.
Var appCache = window.applicationCache; comutare (appCache.status) (case appCache.UNCACHED: // UNCACHED == 0 returnează „UNCACHED”; break; case appCache.IDLE: // IDLE == 1 returnează „IDLE”; break; case appCache.CHECKING: // CHECKING == 2 returnează „CHECKING”; STARE CACHE RECUNOSCĂ";
Pentru actualizare software cache, applicationCache.update() este apelată mai întâi. Va încerca să actualizeze memoria cache a utilizatorului (care necesită modificarea fișierului manifest). În cele din urmă, când applicationCache.status este în starea UPDATEREADY, apelarea applicationCache.swapCache() va actualiza vechiul cache la cel nou.
Var appCache = window.applicationCache; appCache.update(); // Se încearcă actualizarea memoriei cache a utilizatorului... dacă (appCache.status == window.applicationCache.UPDATEREADY) ( appCache.swapCache(); // Reușit, treceți la cache nou }
Utilizarea update() și swapCache() nu servește la actualizarea resurselor pentru utilizator. Acest flux spune pur și simplu browserului să verifice noul manifest, să descarce conținutul actualizat specificat și să repopuleze memoria cache a aplicației. Astfel, pagina este descărcată de pe server de două ori, prima dată umplând noul cache al aplicației, iar a doua oară actualizând conținutul paginii. Vești bune: Puteți evita această descărcare dublă. Pentru a actualiza de la utilizator noua versiune site-ul dvs., setat să monitorizeze evenimentul updateready în timp ce pagina se descarcă.
// Verificați dacă un nou cache este disponibil când pagina este încărcată window.addEventListener("load", function(e) ( window.applicationCache.addEventListener("updateready", function(e)) ( if (window.applicationCache.status = = fereastra applicationCache.UPDATEREADY) ( // Browserul descarcă un nou cache // îl înlocuiește și actualizează pagina window.applicationCache.swapCache(); if (confirm(„O nouă versiune a acestui site este disponibilă. Încărcați-o?”) )) ( window.location.reload( ); ) ) else ( // Manifestul nu s-a schimbat, nimic nou pe server ) ), false ), false);
Evenimente AppCache
După cum vă puteți aștepta, evenimente suplimentare monitorizează starea memoriei cache. Browserul declanșează evenimente în timpul procesului de descărcare, când memoria cache a aplicației este actualizată și când apare o eroare. Următorul fragment ascultă evenimente pentru fiecare tip de eveniment din cache:
Funcția handleCacheEvent(e) ( //... ) funcția handleCacheError(e) ( alert(Eroare: a eșuat actualizarea cache-ului!"); // Executată după prima memorare în cache a manifestului appCache.addEventListener("cached", handleCacheEvent , false ); // Verificarea actualizării este întotdeauna pe primul loc în secvența de evenimente appCache.addEventListener("verificare", handleCacheEvent, false, browserul preia resursele appCache.addEventListener("descărcare"); , handleCacheEvent, false); // Manifestul a returnat o eroare 404 sau 410, descărcarea a fost întreruptă // sau manifestul a fost modificat în timp ce descărcarea era în curs appCache.addEventListener("error", handleCacheError, // Execut after the prima descărcare a manifestului appCache.addEventListener("noupdate", handleCacheEvent, false ; handleCacheEvent, false ; // Execut când resursele manifest au fost descărcate recent appCache.addEventListener("updateready", handleCacheEvent, false);
Dacă fișierul manifest sau resursa specificată nu poate fi descărcată, toate actualizările sunt eliminate. Browserul va continua să folosească vechiul cache al aplicației în cazul unei astfel de eșecuri.
Salutare tuturor! Astăzi vreau să vă spun cum să faceți un cache elemente exterioareîn Google PageSpeed Insights pentru a vă crește viteza site-ului. Ideea va fi să descărcați js și alte fișiere descărcabile din resurse externe pe site-ul dvs.
Cum să activați memoria cache a fișierelor în browser
Înainte de a scrie despre cum să activați stocarea în cache a fișierelor pentru site-ul dvs. în browser din partea utilizatorului, vreau să explic ce este un cache.
Cache- stocarea fișierelor vizualizate pe computerul dvs., ceea ce la rândul său crește viteza de încărcare a paginii sau a site-ului atunci când îl vizualizați din nou. Cache-ul are propriul termen de valabilitate, după care este actualizat sau șters.
Ne-am dat seama ce este un cache. Acum, să verificăm site-ul nostru în serviciul PageSpeed și să ne asigurăm că Google recomandă să folosim memoria cache a browserului. Iată un fragment din mesaj.
Dacă specificați data sau data de expirare a resurselor statice în anteturile HTTP, browserul va încărca resursele primite anterior de la disc local, nu de pe internet.
Dacă aceste fișiere se află pe resursa dvs., atunci puteți scrie codul de cache al browserului în fișier htaccess, situat la rădăcina site-ului. Iată codul în sine, dacă cineva are nevoie de el.
# text de compresie, html, javascript, css, xml:
Lipind acest cod în fișierul htacces, vă puteți verifica de două ori site-ul serviciu Google Viteza paginii
Perspective. Daca in sectiunea " utilizați memoria cache a browserului„Totul este în regulă, asta înseamnă că îl vei avea acolo
numai link-uri către resurse externe, cum ar fi analitice, sociale
butoane și așa mai departe.
Personal, în paralel cu acest cod, folosesc capacitățile găzduirii mele pentru a stoca în cache fișierele din partea utilizatorului. Arata cam asa. 
După cum puteți vedea, găzduirea mea vă permite să activați stocarea în cache din partea browserului și să setați nivelul de compresie și perioada de stocare a fișierelor. De asemenea, folosesc un plugin pentru încărcare rapidă pagini wp super cache, dar poate le voi spune cititorilor mei despre asta cumva, abonat la actualizările blogului.
Cum să activați memoria cache a fișierelor externe în Google PageSpeed Insights
Dacă ați urmat recomandările pentru stocarea în cache a fișierelor de pe blogul dvs. Trebuie, în instrument Google PageSpeed Insights, vedeți numai linkuri către resurse externe. Trebuie să ai ceva asemănător. 
După cum puteți vedea din captură de ecran, Google PageSpeed Insights înjură resurse externe, cum ar fi valorile Yandex, google analytics și altele. Acum vă voi spune cum să remediați această eroare și să faceți legături către resurse externe interne și stocate în cache pe partea serverului dvs.
Utilizarea memoriei cache a browserului pentru resurse externe
Deoarece fișierele de resurse externe nu aparțin site-ului nostru, acestea trebuie mai întâi descărcate. Pentru a descărca fișiere externe din resurse terțe, trebuie să creăm un fișier kesh_js.php cu următorul cod. Va sfatuiesc sa folositi Blocnotes++ pentru adăugarea rapidă și corectă a codului la un fișier.
Pentru a scrie codul de care avem nevoie. luați și copiați acest link:
downloadJs( ‘inserați linkul de la PageSpeed aici /metrics.js ‘ , realpath("./ folder_js« ) . ‘/ metrics.js- introduceți aici dosar final’ ) ;
În acest fel, puteți adăuga multe interogări. Singurul lucru este să nu uitați să vă asigurați că nu aveți fișiere duplicate în folder. În acest caz, utilizați un fișier pentru mai multe scripturi, de obicei același script, sau redenumiți-l.
După adăugarea codului în fișier kesh_js.php, îi poți numi altfel. Trebuie să fie încărcat la rădăcina site-ului nostru. De asemenea, în rădăcina site-ului, trebuie să creați un folder folder_js, sau sub alt nume cu drept de acces 777/755. Pentru a seta drepturile de acces pentru un folder, vă recomand să utilizați Fillizille.
Pentru a face acest lucru, pur și simplu deschideți programul filzilla. Apoi, selectați folderul și setați drepturile de acces, asigurați-vă că la 777, după care îl schimbăm înapoi la 755. Acest lucru se poate face și în panoul de control al găzduirii dvs. dacă nu doriți să utilizați acest program. Vă voi arăta o captură de ecran cu setarea drepturilor de acces în programul Fillizilla. 
Apoi deschideți secțiunea „ permisiuni pentru fișiere" și introduceți valoarea noastră 777/755.
Cum să activați programatorul de activități pentru site (cron)
Următorul pas, trebuie să activăm programatorul de activități pentru site-ul nostru, astfel încât scriptul nostru https://adresa site-ului dvs./kesh_js.php alerga zilnic. Datorită acestui lucru, va fi mereu pe site-ul nostru versiunea curentă fișiere din resurse externe. Chiar dacă dezvoltatorii fac modificări la codul lor, vom avea întotdeauna versiune de lucru pe site, datorită programatorului de sarcini.
Pentru a programa sarcini pentru site-ul dvs., trebuie să mergeți la panoul de control al găzduirii și să introduceți una dintre opțiunile de cod.
rularea unei sarcini prin GET. Dacă trebuie să rulați un job cron ținând cont de contextul motorului:
GET https://site.ru/script.php
unde site.ru este numele domeniului dvs., iar script.php este numele fișierului cu sarcina;
rulează un job prin WGET. O opțiune alternativă pentru rularea unui job cron, ținând cont de contextul motorului:
Wget -q -O - https://site.ru/script.php> /dev/null 2>&1
unde site.ru este numele domeniului dvs., iar script.php este numele fișierului cu sarcina;
În cazul nostru, trebuie să scriem:
OBȚINE https://adresa site-ului tău web/kesh_js.php
Sau alege varianta alternativa, eu personal m-am hotarat pe primul.
Ne-am dat seama ce să înregistrăm, acum deschidem găzduirea și mergem la panoul de control al acestuia. Folosesc panoul de control ISPmanager, dacă aveți unul diferit, căutați fila de planificare a sarcinilor sau cron.
Acum, deschideți fila „creați”.
Apoi ștergem memoria cache a browserului. Pentru Google Chrome, utilizați combinația de taste ctrl+shift+delete și verificați funcționarea site-ului. De asemenea, vă recomand să vă rulați din nou site-ul prin instrumentul PageSpeed Insights.
Asta e tot ce am, iti doresc indicator bun, datorită acestei metode de accelerare a paginii. În articolul următor, vă voi spune cum să creați un buton colorat abonamente youtube pentru blogul tău, așa că nu uita abonați-vă la actualizări. La revedere tuturor!
