fix: omit moment-locales from precache

pwa/src/service-worker/set-up-service-worker.js

@@ -26,6 +26,7 @@ import {
     setUpKillSwitchServiceWorker,
     getClientsInfo,
     claimClients,
+    CRA_MANIFEST_EXCLUDE_PATTERNS,
 } from './utils.js'
 
 export function setUpServiceWorker() {
@@ -127,10 +128,24 @@ export function setUpServiceWorker() {
         }
         registerRoute(navigationRouteMatcher, navigationRouteHandler)
 
-        // Handle the rest of files in the manifest
-        const restOfManifest = precacheManifest.filter(
-            (e) => e !== indexHtmlManifestEntry
-        )
+        // Handle the rest of files in the manifest - filter out index.html,
+        // and all moment-locales, which bulk up the precache and slow down
+        // installation significantly. Handle them network-first in app shell
+        const restOfManifest = precacheManifest.filter((e) => {
+            if (e === indexHtmlManifestEntry) {
+                return false
+            }
+            // Files from the precache manifest generated by CRA need to be
+            // managed here, because we don't have access to their webpack
+            // config
+            const entryShouldBeExcluded = CRA_MANIFEST_EXCLUDE_PATTERNS.some(
+                (pattern) => pattern.test(e.url)
+            )
+            if (entryShouldBeExcluded) {
+                return false
+            }
+            return true
+        })
         precacheAndRoute(restOfManifest)
 
         // Similar to above; manifest injection from `workbox-build`
@@ -175,12 +190,9 @@ export function setUpServiceWorker() {
     )
 
     // Network-first caching by default
-    // (and for static assets while in development)
     // * NOTE: there may be lazy-loading errors while offline in dev mode
     registerRoute(
-        ({ url }) =>
-            urlMeetsAppShellCachingCriteria(url) ||
-            (!PRODUCTION_ENV && fileExtensionRegexp.test(url.pathname)),
+        ({ url }) => urlMeetsAppShellCachingCriteria(url),
         new NetworkFirst({
             cacheName: 'app-shell',
             plugins: [dhis2ConnectionStatusPlugin],

pwa/src/service-worker/utils.js

@@ -11,6 +11,11 @@ const APP_ADAPTER_URL_PATTERNS = [
     /\/api(\/\d+)?\/userSettings/, // useLocale
     /\/api(\/\d+)?\/me\?fields=id$/, // useVerifyLatestUser
 ]
+// Note that the CRA precache manifest files start with './'
+// TODO: Make this extensible with a d2.config.js option
+export const CRA_MANIFEST_EXCLUDE_PATTERNS = [
+    /^\.\/static\/js\/moment-locales\//,
+]
 
 // '[]' Fallback prevents error when switching from pwa enabled to disabled
 const APP_SHELL_URL_FILTER_PATTERNS = JSON.parse(
@@ -52,6 +57,14 @@ export function setUpKillSwitchServiceWorker() {
 }
 
 export function urlMeetsAppShellCachingCriteria(url) {
+    // If this request is for a file that belongs to this app, cache it
+    // (in production, many, but not all, app files will be precached -
+    // e.g. moment-locales is omitted)
+    const appScope = new URL('./', self.location.href)
+    if (url.href.startsWith(appScope.href)) {
+        return true
+    }
+
     // Cache this request if it is important for the app adapter to load
     const isAdapterRequest = APP_ADAPTER_URL_PATTERNS.some((pattern) =>
         pattern.test(url.href)