⚠️ This component is decommissioned! ⚠️
Global service worker component for next.ft.com
npm install --save @financial-times/n-service-worker
Service workers need to be run over HTTPS. To avoid any nasty cert issues, you'll need to [add the self-signed cert to your keychain] (https://github.com/Financial-Times/next-router#https)
General workflow is
front-page
,
configure it to run as https and serve the service worker locally cd next-front-page
nht run --https --local-apps service-worker=3010
cd n-service-worker
npm start
This will also start webpack's watch
As service workers are potentially disastrous in their impact and difficult to roll back quickly, n-service-worker is one of the few parts of the next stack which has the concept of multiple qa environments. Releases happen in up to 4 stages (any of which can be skipped in a hurry/emergency).
When releasing changes to n-service-worker consider how likely your changes are to go wrong and whether unit tests provide adequate coverage.
If you're only changing main.js
, or the templates, this is just a normal component release. To get it into prod create a semver tag on this repo.
Builds tagged with special tags and main
builds push files named __sw-{prod,canary,qa,main}.js
to s3. Feature flags are then used to toggle which one is installed for which users. The relevant flags are
swQAVariant
- multivariant flag used by QA to choose between any of the 4 service worker variantsswCanaryRelease
- forces a small percentage of users onto an experimental version of the service worker/__sw-main.js
qa-v{release number}
will release /__sw-qa.js
canary-v{release number}
will release /__sw-canary.js
prod-v{release number}
will release /__sw-prod.js
v1.2.3
)... yes, always use semverprod-v7
, but the last qa release was qa-v3
, and you need to create a qa release, make it qa-v8
so that when it gets to prod, the prod tage can be prod-v8
To move a version of the service worker through one or more stages of the release cycle, care must be taken to tag the same commit with the related qa
, canary
and prod
tags
Unfortunately it's still a manual process, but creating a new tag on the same commit as the last good version should do it. // TODO - set up versioning in s3
For most cases sw-toolbox is used to manage caches, but n-service-worker also provides a few other utilities
On each page load the service worker is passed the current set of feature flags. Depending on what you're using the flag to toggle on\off, it may not take effect until the next page load due to the service worker lifecycle
import { getFlag } from "./utils/flags";
if (getFlag("swUseSpecificCache")) {
// do something
}
sw-toolbox doesn't offer all features on its cache and precache utilities, so we offer enhanced versions
import cache from "./utils/cache";
import precache from "./utils/precache";
// then use instead of toolbox.cache or toolbox.precache
To turn on whether a particular request fetches from a cache or network, based on the value of a flag, use the getHandler function from utils/handlers
import { getHandler } from "./utils/handlers";
const myHandler = getHandler({ flag: "swAdsCaching", strategy: "cacheFirst" });
toolbox.get("/url", myHandler);