Քեշավորման մեթոդներ (Cache API)

Service Worker-ները թույլ են տալիս կառավարել ռեսուրսների քեշավորումը՝ օգտագործելով Cache API-ը։ Սա JavaScript ինտերֆեյս է, որը տալիս է մեզ մուտք դեպի բրաուզերի քեշ՝ որտեղ կարող ենք պահպանել HTML, CSS, JavaScript, պատկերներ և այլն։

Օրինակ՝ նախօրոք ռեսուրսների քեշավորում install event-ում

  
const CACHE_NAME = 'site-cache-v1';
const urlsToCache = [
  '/',
  '/index.html',
  '/styles.css',
  '/main.js',
  '/fallback.html',
];

self.addEventListener('install', event => {
  event.waitUntil(
    caches.open(CACHE_NAME).then(cache => {
      return cache.addAll(urlsToCache);
    })
  );
});
  

Օրինակ՝ հարցումների պատասխան քեշից կամ ցանցից fetch event-ում

  
self.addEventListener('fetch', event => {
  event.respondWith(
    caches.match(event.request).then(response => {
      // Եթե քեշում կա՝ վերադարձնում ենք այն
      if (response) {
        return response;
      }

      // Եթե չկա՝ բերում ենք ցանցից և պահում քեշում
      return fetch(event.request).then(networkResponse => {
        return caches.open(CACHE_NAME).then(cache => {
          cache.put(event.request, networkResponse.clone());
          return networkResponse;
        });
      });
    })
  );
});
  

Քեշավորման ռազմավարություններ՝

• Cache-first – Նախ փորձում է ստանալ քեշից, եթե չկա՝ ցանցից
• Network-first – Նախ փորձում է ցանցից, եթե չկա՝ քեշից
• Cache-only – Միայն քեշից սպասարկում
• Network-only – Միայն ցանցից բերում
• Stale-while-revalidate – Քեշից բերում է, բայց ֆոնում նորացնում է ցանցից

Ճիշտ ռազմավարության ընտրությունը կարևոր է՝ կախված հավելվածի տեսակից։ Օրինակ՝ բովանդակության կայքերը կարող են օգտվել cache-first-ից, մինչդեռ թարմ տվյալներ պահանջող հավելվածները՝ network-first-ից։