# Network-first Pattern — Progressive Web Apps

Source: https://www.geekswithgeeks.com/hi/pwa/pwa-network-first

> 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 करें।

```javascript
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.
```

त्वरित जाँच

**Quiz:** Network-first caching कब use करनी चाहिए?

- [x] HTML pages और frequently updated content के लिए
- [ ] Static assets जैसे images और fonts के लिए
- [ ] केवल old browsers के लिए

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