पाठ 9 / 29

Network-first Pattern

Network-first strategy को implement करें: fresh content fetch करें, offline होने पर cache पर fall back करें।

Network-first कब use करें

Network-first server से fresh content को prioritize करता है। अगर network fail हो तो cache पर fall back करें। HTML pages और frequently updated content के लिए best है।

Network-first Implementation

पहले network से fetch करें, response को cache करें और network error पर cache पर fall back करें।

self.addEventListener('fetch', event => {
  event.respondWith(
    fetch(event.request)
      .then(response => {
        const clone = response.clone();
        caches.open('v1').then(cache => cache.put(event.request, clone));
        return response;
      })
      .catch(() => caches.match(event.request))
  );
});

Output:

Always attempts fresh content; serves cached version if network unavailable.

त्वरित जाँच

त्वरित जाँच: Network-first caching कब use करनी चाहिए?

  • HTML pages और frequently updated content के लिए
  • Static assets जैसे images और fonts के लिए
  • केवल old browsers के लिए
Answer

HTML pages और frequently updated content के लिए — Network-first उस content के लिए ideal है जो अक्सर बदलता है और freshness चाहता है।