update head

layout/common/head.jsx

@@ -172,6 +172,7 @@ module.exports = class extends Component {
             <link rel="preload" as="style" onload="this.onload=null;this.rel='stylesheet'" href={fontCssUrl[variant]} />
             <link rel="stylesheet" href={url_for('/css/' + variant + '.css')} />
             <Plugins site={site} config={config} helper={helper} page={page} head={true} />
+            <script>if('serviceWorker'in navigator){window.addEventListener('load',function(){navigator.serviceWorker.register('/js/sw.js').then(function(registration){console.log('ServiceWorker registration successful with scope: ',registration.scope)}).catch(function(err){console.log('ServiceWorker registration failed: ',err)})})}</script>
 
             {adsenseClientId ? <script data-ad-client={adsenseClientId}
                 src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js" async></script> : null}

package.json

@@ -1,6 +1,6 @@
 {
   "name": "hexo-theme-amane",
-  "version": "0.0.33",
+  "version": "0.0.34",
   "author": "Nofated095 <nofated095@users.noreply.github.com>",
   "license": "MIT",
   "description": "A simple, delicate, and modern theme for Hexo",

source/js/sw.js

@@ -0,0 +1,262 @@
+importScripts('https://cdn.jsdelivr.net/npm/workbox-cdn@5.1.4/workbox/workbox-sw.js');
+
+workbox.setConfig({
+    modulePathPrefix: 'https://cdn.jsdelivr.net/npm/workbox-cdn@5.1.4/workbox/'
+});
+
+const { core, precaching, routing, strategies, expiration, cacheableResponse, backgroundSync } = workbox;
+const { CacheFirst, NetworkFirst, NetworkOnly, StaleWhileRevalidate } = strategies;
+const { ExpirationPlugin } = expiration;
+const { CacheableResponsePlugin } = cacheableResponse;
+
+const cacheSuffixVersion = '-231126',
+    // precacheCacheName = core.cacheNames.precache,
+    // runtimeCacheName = core.cacheNames.runtime,
+    maxEntries = 100;
+
+self.addEventListener('activate', (event) => {
+    event.waitUntil(
+        caches.keys().then((keys) => {
+            return Promise.all(keys.map((key) => {
+                if (key.includes('disqus-cdn-cache')) return caches.delete(key);
+                if (key.includes('disqus-img-cache')) return caches.delete(key);
+                if (!key.includes(cacheSuffixVersion)) return caches.delete(key);
+            }));
+        })
+    );
+});
+
+
+core.setCacheNameDetails({
+    prefix: 'amaneblog',
+    suffix: cacheSuffixVersion
+});
+
+core.skipWaiting();
+core.clientsClaim();
+precaching.cleanupOutdatedCaches();
+
+routing.registerRoute(
+    /.*lf3-cdn-tos\.bytecdntp\.com/,
+    new CacheFirst({
+        cacheName: 'static-immutable' + cacheSuffixVersion,
+        fetchOptions: {
+            mode: 'cors',
+            credentials: 'omit'
+        },
+        plugins: [
+            new ExpirationPlugin({
+                maxAgeSeconds: 30 * 24 * 60 * 60,
+                purgeOnQuotaError: true
+            })
+        ]
+    })
+);
+
+registerRoute(
+    /.*xgjalbum\.oss-cn-hangzhou\.aliyuncs\.com/,
+    new CacheFirst({
+        cacheName: 'static-immutable' + cacheSuffixVersion,
+        fetchOptions: {
+            mode: 'cors',
+            credentials: 'omit'
+        },
+        plugins: [
+            new ExpirationPlugin({
+                maxAgeSeconds: 30 * 24 * 60 * 60,
+                purgeOnQuotaError: true
+            })
+        ]
+    })
+);
+
+routing.registerRoute(
+    /.*cdn\.staticfile\.org/,
+    new CacheFirst({
+        cacheName: 'static-immutable' + cacheSuffixVersion,
+        fetchOptions: {
+            mode: 'cors',
+            credentials: 'omit'
+        },
+        plugins: [
+            new ExpirationPlugin({
+                maxAgeSeconds: 30 * 24 * 60 * 60,
+                purgeOnQuotaError: true
+            })
+        ]
+    })
+);
+
+routing.registerRoute(
+    /.*cdn\.nofated\.win/,
+    new CacheFirst({
+        cacheName: 'static-immutable' + cacheSuffixVersion,
+        fetchOptions: {
+            mode: 'cors',
+            credentials: 'omit'
+        },
+        plugins: [
+            new ExpirationPlugin({
+                maxAgeSeconds: 30 * 24 * 60 * 60,
+                purgeOnQuotaError: true
+            })
+        ]
+    })
+);
+
+routing.registerRoute(
+    /.*cdn\.jsdelivr\.net/,
+    new CacheFirst({
+        cacheName: 'static-immutable' + cacheSuffixVersion,
+        fetchOptions: {
+            mode: 'cors',
+            credentials: 'omit'
+        },
+        plugins: [
+            new ExpirationPlugin({
+                maxAgeSeconds: 30 * 24 * 60 * 60,
+                purgeOnQuotaError: true
+            })
+        ]
+    })
+);
+
+routing.registerRoute(
+    /.*fonts\.googleapis\.cn/,
+    new CacheFirst({
+        cacheName: 'static-immutable' + cacheSuffixVersion,
+        fetchOptions: {
+            mode: 'cors',
+            credentials: 'omit'
+        },
+        plugins: [
+            new ExpirationPlugin({
+                maxAgeSeconds: 30 * 24 * 60 * 60,
+                purgeOnQuotaError: true
+            })
+        ]
+    })
+);
+
+routing.registerRoute(
+    /.*fonts\.googleapis\.cn/,
+    new CacheFirst({
+        cacheName: 'static-immutable' + cacheSuffixVersion,
+        fetchOptions: {
+            mode: 'cors',
+            credentials: 'omit'
+        },
+        plugins: [
+            new ExpirationPlugin({
+                maxAgeSeconds: 30 * 24 * 60 * 60,
+                purgeOnQuotaError: true
+            })
+        ]
+    })
+);
+
+routing.registerRoute(
+    /.*fonts\.gstatic\.cn/,
+    new CacheFirst({
+        cacheName: 'static-immutable' + cacheSuffixVersion,
+        fetchOptions: {
+            mode: 'cors',
+            credentials: 'omit'
+        },
+        plugins: [
+            new ExpirationPlugin({
+                maxAgeSeconds: 30 * 24 * 60 * 60,
+                purgeOnQuotaError: true
+            })
+        ]
+    })
+);
+
+
+routing.registerRoute(
+    new RegExp('google-analytics.com'),
+    new NetworkOnly({
+        plugins: [
+            new backgroundSync.BackgroundSyncPlugin('ga', {
+                maxRetentionTime: 12 * 60
+            }),
+        ]
+    }),
+    "POST"
+);
+
+routing.registerRoute(
+    new RegExp('disqus'),
+    new NetworkFirst({
+        plugins: [
+            new backgroundSync.BackgroundSyncPlugin('disqus', {
+                maxRetentionTime: 12 * 60
+            }),
+        ]
+    })
+);
+
+routing.registerRoute(
+    new RegExp('analytics.google.com'),
+    new NetworkOnly({
+        plugins: [
+            new backgroundSync.BackgroundSyncPlugin('ga_new', {
+                maxRetentionTime: 12 * 60
+            }),
+        ]
+    }),
+    "POST"
+)
+
+const StaleWhileRevalidateInstance = new StaleWhileRevalidate();
+/*
+ * Others img
+ * Method: staleWhileRevalidate
+ * cacheName: img-cache
+ */
+routing.registerRoute(
+    // Cache image files
+    /.*\.(?:png|jpg|jpeg|gif|webp)/,
+    StaleWhileRevalidateInstance
+);
+
+/*
+ * Static Assets
+ * Method: staleWhileRevalidate
+ * cacheName: static-assets-cache
+ */
+routing.registerRoute(
+    // Cache CSS files
+    /.*\.(css|js)/,
+    // Use cache but update in the background ASAP
+    StaleWhileRevalidateInstance
+);
+
+/*
+ * sw.js - Revalidate every time
+ * staleWhileRevalidate
+ */
+routing.registerRoute(
+    '/js/sw.js',
+    StaleWhileRevalidateInstance
+);
+
+
+
+routing.registerRoute(
+    new RegExp('blog'),
+    StaleWhileRevalidateInstance
+);
+
+routing.registerRoute(
+    /.*localhost/,
+    new NetworkOnly()
+);
+
+/*
+ * Default - Serve as it is
+ * StaleWhileRevalidate
+ */
+routing.setDefaultHandler(
+    new NetworkOnly()
+);