https://hipowercr.com/sw.js

1// Bump this version on every deploy to force cache invalidation
2const CACHE_VERSION = 'v5';
3const STATIC_CACHE = `hipower-static-${CACHE_VERSION}`;
4const ASSETS_CACHE = `hipower-assets-${CACHE_VERSION}`;
5
6const PRECACHE_ASSETS = [
7  '/assets/landing/LogoHiPower.svg',
8  '/assets/homepage/HeroBG.png',
9  '/assets/fonts/Futura Bold font.ttf',
10  '/assets/fonts/futura medium condensed bt.ttf',
11  '/assets/fonts/FuturaMediumBT.ttf'
12];
13
14self.addEventListener('install', event => {
15  event.waitUntil(
16    caches.open(ASSETS_CACHE).then(cache => cache.addAll(PRECACHE_ASSETS))
17  );
18  self.skipWaiting();
19});
20
21self.addEventListener('activate', event => {
22  event.waitUntil(
23    caches.keys().then(keys =>
24      Promise.all(
25        keys
26          .filter(key => key !== STATIC_CACHE && key !== ASSETS_CACHE)
27          .map(key => caches.delete(key))
28      )
29    )
30  );
31  self.clients.claim();
32});
33
34self.addEventListener('fetch', event => {
35  const { request } = event;
36  const url = new URL(request.url);
37
38  if (request.method !== 'GET' || url.origin !== self.location.origin) return;
39
40  // _next/static/ files have content-hash in their name → safe to cache forever (cache-first)
41  // BUT: never serve stale HTML pages — they reference chunk hashes that must stay in sync
42  if (url.pathname.startsWith('/_next/static/')) {
43    event.respondWith(
44      caches.open(STATIC_CACHE).then(async cache => {
45        const cached = await cache.match(request);
46        if (cached) return cached;
47        const fresh = await fetch(request);
48        if (fresh.ok) cache.put(request, fresh.clone());
49        return fresh;
50      })
51    );
52    return;
53  }
54
55  // Static assets (images, fonts, videos) → cache-first with network fallback
56  if (url.pathname.startsWith('/assets/')) {
57    event.respondWith(
58      caches.open(ASSETS_CACHE).then(async cache => {
59        const cached = await cache.match(request);
60        if (cached) return cached;
61        const fresh = await fetch(request);
62        if (fresh.ok) cache.put(request, fresh.clone());
63        return fresh;
64      })
65    );
66    return;
67  }
68
69  // HTML pages → network-first so users always get fresh HTML with correct chunk references.
70  // Fall back to cache only when offline.
71  if (request.mode === 'navigate') {
72    event.respondWith(
73      fetch(request)
74        .then(async response => {
75          if (response.ok) {
76            const cache = await caches.open(STATIC_CACHE);
77            cache.put(request, response.clone());
78          }
79          return response;
80        })
81        .catch(async () => {
82          const cached = await caches.match(request);
83          return cached || caches.match('/');
84        })
85    );
86    return;
87  }
88});