Skip to content
This repository has been archived by the owner on Jun 24, 2022. It is now read-only.

Commit

Permalink
fix: turn service workers back on (#1944)
Browse files Browse the repository at this point in the history
reconfigure service workers to only cache used assets (excluding .po language files and non-.var.woff2 font files)

* fix: turn service workers back on

* chore: configure service worker caches

* chore: add newline

* Fix code style issues with ESLint

* chore: limit service-worker caching

Co-authored-by: Zach Pomerantz <[email protected]>
Co-authored-by: Lint Action <[email protected]>
  • Loading branch information
3 people authored Aug 25, 2021
1 parent 1304acd commit b8a9191
Show file tree
Hide file tree
Showing 4 changed files with 36 additions and 74 deletions.
4 changes: 1 addition & 3 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -116,10 +116,8 @@
"use-count-up": "^2.2.5",
"wcag-contrast": "^3.0.0",
"workbox-core": "^6.1.0",
"workbox-expiration": "^6.1.0",
"workbox-precaching": "^6.1.0",
"workbox-routing": "^6.1.0",
"workbox-strategies": "^6.1.0"
"workbox-routing": "^6.1.0"
},
"resolutions": {
"@walletconnect/ethereum-provider": "1.6.4"
Expand Down
2 changes: 1 addition & 1 deletion src/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -86,4 +86,4 @@ ReactDOM.render(
document.getElementById('root')
)

serviceWorkerRegistration.unregister()
serviceWorkerRegistration.register()
95 changes: 33 additions & 62 deletions src/service-worker.ts
Original file line number Diff line number Diff line change
@@ -1,80 +1,51 @@
/// <reference lib="webworker" />
/* eslint-disable no-restricted-globals */

// This service worker can be customized!
// See https://developers.google.com/web/tools/workbox/modules
// for the list of available Workbox modules, or add any other
// code you'd like.
// You can also remove this file if you'd prefer not to use a
// service worker, and the Workbox build step will be skipped.

import { clientsClaim } from 'workbox-core'
import { ExpirationPlugin } from 'workbox-expiration'
import { createHandlerBoundToURL, precacheAndRoute } from 'workbox-precaching'
import { registerRoute } from 'workbox-routing'
import { StaleWhileRevalidate } from 'workbox-strategies'

declare const self: ServiceWorkerGlobalScope

clientsClaim()

// Precache all of the assets generated by your build process.
// Their URLs are injected into the manifest variable below.
// This variable must be present somewhere in your service worker file,
// even if you decide not to use precaching. See https://cra.link/PWA
precacheAndRoute(self.__WB_MANIFEST)

// Set up App Shell-style routing, so that all navigation requests
// are fulfilled with your index.html shell. Learn more at
// https://developers.google.com/web/fundamentals/architecture/app-shell
const fileExtensionRegexp = new RegExp('/[^/?]+\\.[^/]+$')
registerRoute(
// Return false to exempt requests from being fulfilled by index.html.
({ request, url }: { request: Request; url: URL }) => {
// If this isn't a navigation, skip.
if (request.mode !== 'navigate') {
return false
}
// Precache the relevant assets generated by the build process.
const manifest = self.__WB_MANIFEST.filter((entry) => {
const url = typeof entry === 'string' ? entry : entry.url
// If this is a language file, skip. They are compiled elsewhere.
if (url.endsWith('.po')) {
return false
}

// If this is a URL that starts with /_, skip.
if (url.pathname.startsWith('/_')) {
return false
}
// If this isn't a var woff2 font, skip. Modern browsers only need var fonts.
if (url.endsWith('.woff') || (url.endsWith('.woff2') && !url.includes('.var'))) {
return false
}

// If this looks like a URL for a resource, because it contains
// a file extension, skip.
if (url.pathname.match(fileExtensionRegexp)) {
return false
}
return true
})
precacheAndRoute(manifest)

// Return true to signal that we want to use the handler.
return true
},
createHandlerBoundToURL(process.env.PUBLIC_URL + '/index.html')
)
// Set up App Shell-style routing, so that navigation requests are fulfilled
// immediately with a local index.html shell. See
// https://developers.google.com/web/fundamentals/architecture/app-shell
const fileExtensionRegexp = new RegExp('/[^/?]+\\.[^/]+$')
registerRoute(({ request, url }: { request: Request; url: URL }) => {
// If this isn't app.uniswap.org, skip. IPFS gateways may not have domain
// separation, so they cannot use App Shell-style routing.
if (url.hostname !== 'app.uniswap.org') {
return false
}

// An example runtime caching route for requests that aren't handled by the
// precache, in this case same-origin .png requests like those from in public/
registerRoute(
// Add in any other file extensions or routing criteria as needed.
({ url }) => url.origin === self.location.origin && url.pathname.endsWith('.png'),
// Customize this strategy as needed, e.g., by changing to CacheFirst.
new StaleWhileRevalidate({
cacheName: 'images',
plugins: [
// Ensure that once this runtime cache reaches a maximum size the
// least-recently used images are removed.
new ExpirationPlugin({ maxEntries: 50 }),
],
})
)
// If this isn't a navigation, skip.
if (request.mode !== 'navigate') {
return false
}

// This allows the web app to trigger skipWaiting via
// registration.waiting.postMessage({type: 'SKIP_WAITING'})
self.addEventListener('message', (event) => {
if (event.data && event.data.type === 'SKIP_WAITING') {
self.skipWaiting()
// If this looks like a URL for a resource, skip.
if (url.pathname.match(fileExtensionRegexp)) {
return false
}
})

// Any other custom service worker logic can go here.
return true
}, createHandlerBoundToURL(process.env.PUBLIC_URL + '/index.html'))
9 changes: 1 addition & 8 deletions yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -19386,13 +19386,6 @@ workbox-expiration@^5.1.4:
dependencies:
workbox-core "^5.1.4"

workbox-expiration@^6.1.0:
version "6.1.5"
resolved "https://registry.npmjs.org/workbox-expiration/-/workbox-expiration-6.1.5.tgz"
integrity sha512-6cN+FVbh8fNq56LFKPMchGNKCJeyboHsDuGBqmhDUPvD4uDjsegQpDQzn52VaE0cpywbSIsDF/BSq9E9Yjh5oQ==
dependencies:
workbox-core "^6.1.5"

workbox-google-analytics@^5.1.4:
version "5.1.4"
resolved "https://registry.yarnpkg.com/workbox-google-analytics/-/workbox-google-analytics-5.1.4.tgz#b3376806b1ac7d7df8418304d379707195fa8517"
Expand Down Expand Up @@ -19455,7 +19448,7 @@ workbox-strategies@^5.1.4:
workbox-core "^5.1.4"
workbox-routing "^5.1.4"

workbox-strategies@^6.1.0, workbox-strategies@^6.1.5:
workbox-strategies@^6.1.5:
version "6.1.5"
resolved "https://registry.npmjs.org/workbox-strategies/-/workbox-strategies-6.1.5.tgz"
integrity sha512-QhiOn9KT9YGBdbfWOmJT6pXZOIAxaVrs6J6AMYzRpkUegBTEcv36+ZhE/cfHoT0u2fxVtthHnskOQ/snEzaXQw==
Expand Down

0 comments on commit b8a9191

Please sign in to comment.