Improve service worker based caching 2

This commit is contained in:
Hans5958 2023-04-01 15:56:52 +07:00
parent 0e21f1aec8
commit 2588bde989
2 changed files with 15 additions and 17 deletions

View file

@ -8,25 +8,25 @@
"description": "The atlas for the r/place event of 2022 hosted on Reddit.", "description": "The atlas for the r/place event of 2022 hosted on Reddit.",
"icons": [ "icons": [
{ {
"src": "/_img/pwa/logo-round-192x192.png", "src": "./_img/pwa/logo-round-192x192.png",
"sizes": "192x192", "sizes": "192x192",
"type": "image/png", "type": "image/png",
"purpose": "any" "purpose": "any"
}, },
{ {
"src": "/_img/pwa/logo-maskable-192x192.png", "src": "./_img/pwa/logo-maskable-192x192.png",
"sizes": "192x192", "sizes": "192x192",
"type": "image/png", "type": "image/png",
"purpose": "maskable" "purpose": "maskable"
}, },
{ {
"src": "/_img/pwa/logo-round-512x512.png", "src": "./_img/pwa/logo-round-512x512.png",
"sizes": "512x512", "sizes": "512x512",
"type": "image/png", "type": "image/png",
"purpose": "any" "purpose": "any"
}, },
{ {
"src": "/_img/pwa/logo-maskable-512x512.png", "src": "./_img/pwa/logo-maskable-512x512.png",
"sizes": "512x512", "sizes": "512x512",
"type": "image/png", "type": "image/png",
"purpose": "maskable" "purpose": "maskable"
@ -34,17 +34,17 @@
], ],
"screenshots": [ "screenshots": [
{ {
"src": "/_img/pwa/screenshot-1.png", "src": "./_img/pwa/screenshot-1.png",
"sizes": "750x1334", "sizes": "750x1334",
"type": "image/png" "type": "image/png"
}, },
{ {
"src": "/_img/pwa/screenshot-2.png", "src": "./_img/pwa/screenshot-2.png",
"sizes": "1280x800", "sizes": "1280x800",
"type": "image/png" "type": "image/png"
}, },
{ {
"src": "/_img/pwa/screenshot-3.png", "src": "./_img/pwa/screenshot-3.png",
"sizes": "750x1334", "sizes": "750x1334",
"type": "image/png" "type": "image/png"
} }

View file

@ -1,7 +1,5 @@
// This is the "Offline copy of assets" service worker // This is the "Offline copy of assets" service worker
const QUEUE_NAME = "bgSyncQueue";
importScripts('https://cdn.jsdelivr.net/npm/workbox-sw@6.5.4/build/workbox-sw.js'); importScripts('https://cdn.jsdelivr.net/npm/workbox-sw@6.5.4/build/workbox-sw.js');
self.addEventListener("message", (event) => { self.addEventListener("message", (event) => {
@ -11,14 +9,13 @@ self.addEventListener("message", (event) => {
}); });
workbox.routing.registerRoute( workbox.routing.registerRoute(
({ url }) => !url.pathname.startsWith('/_img/canvas/'), ({ url }) => {!url.pathname.startsWith('/_img/canvas/')},
new workbox.strategies.NetworkFirst({ new workbox.strategies.NetworkFirst({
cacheName: "main", cacheName: "main",
plugins: [ plugins: [
new workbox.backgroundSync.BackgroundSyncPlugin( new workbox.backgroundSync.BackgroundSyncPlugin(
QUEUE_NAME, { "main-queue", {
maxRetentionTime: 24 * 60 maxRetentionTime: 24 * 60 // 24 hours (in minutes)
// Retry for max of 24 Hours (specified in minutes)
} }
) )
] ]
@ -30,10 +27,11 @@ workbox.routing.registerRoute(
new workbox.strategies.CacheFirst({ new workbox.strategies.CacheFirst({
cacheName: "canvas", cacheName: "canvas",
plugins: [ plugins: [
new workbox.expiration.ExpirationPlugin({ new workbox.backgroundSync.BackgroundSyncPlugin(
maxAgeSeconds: 7 * 24 * 60 "canvas-queue", {
// Expire on 7 days (specified in minutes) maxRetentionTime: 4 * 7 * 24 * 60 // 4 weeks (in minutes)
}) }
)
] ]
}) })
); );