Sobes.tech
Ajutor la interviu
Resurse
Pregătirea interviului
Resurse
Căutare de locuri de muncă
Resurse
Legal
Înapoi la întrebări
Middle

Ce este cache-ul aplicației în HTML5?

sobes.tech AI

Răspuns de la AI

Cache-ul aplicației (Application Cache) în HTML5 este un mecanism care permite aplicațiilor web să funcționeze offline, oferind un set de resurse (pagini HTML, CSS, JavaScript, imagini) pe care browser-ul le cachează local.

Pentru utilizarea cache-ului aplicației, este necesar un fișier manifest cu extensia .appcache, legat de pagina HTML prin atributul manifest în tag-ul <html>:

<html manifest="manifest.appcache">
...
</html>

Structura fișierului manifest este următoarea:

CACHE MANIFEST
# Versiunea manifestului (opțional, pentru actualizarea cache-ului)
# v1.0

CACHE:
# Resurse explicit cache-uite
/css/style.css
/js/script.js
/images/logo.png

FALLBACK:
# Resurse de rezervă în cazul lipsei conexiunii
/offline.html /

NETWORK:
# Resurse care trebuie întotdeauna solicitate din rețea
*

Secțiunile principale ale fișierului manifest sunt:

  • CACHE:: Resursele listate în această secțiune vor fi cache-uite după încărcarea primei pagini cu manifestul specificat.
  • FALLBACK:: Definește resurse de rezervă. Dacă o solicitare de rețea pentru o resursă principală eșuează, browser-ul va încărca resursa de rezervă indicată. Format: resursă_principală resursă_de_rezervă.
  • NETWORK:: Resursele listate în această secțiune nu vor fi niciodată cache-uite și vor fi întotdeauna solicitate din rețea. Simbolul * înseamnă că toate resursele neenumerate în alte secțiuni vor fi întotdeauna solicitate din rețea.

Actualizarea cache-ului aplicației are loc atunci când fișierul manifest se modifică. Browser-ul descarcă manifestul actualizat, îl compară cu cel curent și descarcă resursele noi sau modificate. Fişierele noi sunt disponibile doar după reîncărcarea paginii.

Evenimentele legate de cache-ul aplicației:

  • checking: Browser-ul verifică dacă există o versiune nouă a manifestului.
  • downloading: Browser-ul descarcă resursele indicate în noua versiune a manifestului.
  • progress: Progresul descărcării resurselor.
  • updateready: Noua versiune a cache-ului este gata pentru utilizare. Este necesară reîncărcarea paginii.
  • cached: Resursele au fost cache-uite cu succes la prima încărcare.
  • noupdate: Manifestul nu s-a schimbat.
  • error: A apărut o eroare la încărcarea sau actualizarea cache-ului.

API-ul cache-ului aplicației este disponibil prin window.applicationCache.

// Verificarea stării cache-ului
console.log(window.applicationCache.status);

// Tratarea evenimentului updateready
window.applicationCache.addEventListener('updateready', function() {
  if (window.applicationCache.status == window.applicationCache.UPDATEREADY) {
    // Aplică noua versiune a cache-ului și reîncarcă pagina
    window.applicationCache.swapCache();
    window.location.reload();
  }
}, false);

Deși Application Cache oferea funcționalități offline, utilizarea sa nu este recomandată în proiecte noi din cauza complexității de gestionare, a problemelor de actualizare și a lipsei de flexibilitate. Pentru acces offline și alte funcții ale aplicațiilor web progresive (PWA), se utilizează Service Workers.

AnteriorÎn continuare