From 306b928f6fa46125332afb64a028383d56c17324 Mon Sep 17 00:00:00 2001 From: GarboMuffin Date: Thu, 11 May 2023 11:48:55 -0500 Subject: [PATCH] Remove service worker We have never properly embraced service workers. Offline support is an afterthought that hardly works, and our site is not even installable as a PWA We should instead properly advertise the standalone versions. This has been the source of many bug reports over time, so let's just get rid of it. --- README.md | 4 -- src/build/generate-service-worker-plugin.js | 37 --------------- src/p4/index.js | 15 +++---- src/p4/sw.js | 50 --------------------- webpack.config.js | 3 -- 5 files changed, 6 insertions(+), 103 deletions(-) delete mode 100644 src/build/generate-service-worker-plugin.js delete mode 100644 src/p4/sw.js diff --git a/README.md b/README.md index f6e9a490..414d1483 100644 --- a/README.md +++ b/README.md @@ -71,10 +71,6 @@ We ask that you at least take a moment to rename the website. Large files such as NW.js, Electron, and WKWebView executables are stored on an external server outside of this repository. While we aren't actively removing old files (the server still serves files unused since November 2020), we can't promise they will exist forever. The packager uses a secure checksum to validate these downloads. Forks are free to use our servers, but it's easy to setup your own if you'd prefer (it's just a static file server; see `src/packager/large-assets.js` for more information). -### Service worker - -Set the environment variable `ENABLE_SERVICE_WORKER` to `1` to enable service worker for offline support (experimental, not 100% reliable). This is not recommended in development. Our GitHub Actions deploy script uses this by default. - ## Standalone builds The packager supports generating "standalone builds" that are single HTML files containing the entire packager. Large files such as Electron binaries will still be downloaded from a remote server as needed. You can download prebuilt standalone builds from [our GitHub releases](https://github.com/TurboWarp/packager/releases). These can be useful if our website is blocked or you don't have a reliable internet connection. Note that standalone builds do not contain an update checker, so do check on your own occasionally. diff --git a/src/build/generate-service-worker-plugin.js b/src/build/generate-service-worker-plugin.js deleted file mode 100644 index 91388664..00000000 --- a/src/build/generate-service-worker-plugin.js +++ /dev/null @@ -1,37 +0,0 @@ -const RawSource = require('webpack-sources').RawSource; -const crypto = require('crypto'); - -const PLUGIN_NAME = 'GenerateServiceWorkerPlugin'; -const SW_NAME = 'sw.js'; - -const CACHE_PAGES = [ - // The homepage - '' -]; - -class GenerateServiceWorkerPlugin { - apply(compiler) { - const allAssetNames = new Set(CACHE_PAGES); - compiler.hooks.emit.tap(PLUGIN_NAME, compilation => { - compilation.getAssets() - .map(i => i.name) - .forEach((i) => allAssetNames.add(i)); - const assetNames = Array.from(allAssetNames) - .filter((name) => { - if (name.endsWith('.map')) return false; - return name.startsWith('assets/') || name.startsWith('js/') || CACHE_PAGES.includes(name); - }); - const stringifiedAssets = JSON.stringify(assetNames); - const hash = crypto.createHash('sha256').update(stringifiedAssets).digest('hex'); - const workerFile = compilation.getAsset(SW_NAME); - const workerSource = workerFile.source.source().toString(); - const newSource = workerSource - .replace('__IS_PRODUCTION__', JSON.stringify(process.env.NODE_ENV === 'production')) - .replace('[/* __ASSETS__ */]', stringifiedAssets) - .replace('__CACHE_NAME__', JSON.stringify(`p4-${hash}`)); - compilation.updateAsset(SW_NAME, new RawSource(newSource)); - }); - } -} - -module.exports = GenerateServiceWorkerPlugin; diff --git a/src/p4/index.js b/src/p4/index.js index e2b5605a..ba2ec15a 100644 --- a/src/p4/index.js +++ b/src/p4/index.js @@ -1,5 +1,4 @@ import P4 from './P4.svelte'; -import serviceWorker from '!!file-loader?name=sw.js!./sw.js'; const app = new P4({ target: document.getElementById('app') @@ -7,13 +6,11 @@ const app = new P4({ document.body.setAttribute('p4-loaded', ''); -if (process.env.ENABLE_SERVICE_WORKER && 'serviceWorker' in navigator) { - window.addEventListener('load', () => { - navigator.serviceWorker.register(serviceWorker) - .then(() => { - console.log('SW registered'); - }).catch((error) => { - console.log('SW error', error); - }); +// Forcibly unregister any old service worker +if ('serviceWorker' in navigator) { + navigator.serviceWorker.getRegistrations().then((registrations) => { + for (const registration of registrations) { + registration.unregister(); + } }); } diff --git a/src/p4/sw.js b/src/p4/sw.js deleted file mode 100644 index 6f4c5cf2..00000000 --- a/src/p4/sw.js +++ /dev/null @@ -1,50 +0,0 @@ -// These will be replaced at build-time by generate-service-worker-plugin.js -const ASSETS = [/* __ASSETS__ */]; -const CACHE_NAME = __CACHE_NAME__; -const IS_PRODUCTION = __IS_PRODUCTION__; - -const base = location.pathname.substr(0, location.pathname.indexOf('sw.js')); - -self.addEventListener('install', event => { - self.skipWaiting(); - event.waitUntil(caches.open(CACHE_NAME).then(cache => cache.addAll(ASSETS.map(i => i === '' ? base : i)))); -}); - -self.addEventListener('activate', event => { - event.waitUntil( - caches.keys().then(keys => Promise.all(keys.filter(i => i !== CACHE_NAME).map(i => caches.delete(i)))) - ); -}); - -const fetchWithTimeout = (req) => new Promise((resolve, reject) => { - const timeout = setTimeout(reject, 5000); - fetch(req) - .then((res) => { - clearTimeout(timeout); - resolve(res); - }) - .catch((err) => { - clearTimeout(timeout); - reject(err); - }); -}); - -self.addEventListener('fetch', event => { - if (event.request.method !== 'GET') return; - const url = new URL(event.request.url); - if (url.origin !== location.origin) return; - const relativePathname = url.pathname.substr(base.length); - if (IS_PRODUCTION && ASSETS.includes(relativePathname)) { - url.search = ''; - const immutable = !!relativePathname; - if (immutable) { - event.respondWith( - caches.match(new Request(url)).then((res) => res || fetch(event.request)) - ); - } else { - event.respondWith( - fetchWithTimeout(event.request).catch(() => caches.match(new Request(url))) - ); - } - } -}); diff --git a/webpack.config.js b/webpack.config.js index 490bda12..b31825e8 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -4,7 +4,6 @@ const HtmlWebpackPlugin = require('html-webpack-plugin'); const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin; const CopyWebpackPlugin = require('copy-webpack-plugin'); const AddBuildIDToOutputPlugin = require('./src/build/add-build-id-to-output-plugin'); -const GenerateServiceWorkerPlugin = require('./src/build/generate-service-worker-plugin'); const EagerDynamicImportPlugin = require('./src/build/eager-dynamic-import-plugin'); const isProduction = process.env.NODE_ENV === 'production'; @@ -180,7 +179,6 @@ const makeWebsite = () => ({ ] }), new webpack.DefinePlugin({ - 'process.env.ENABLE_SERVICE_WORKER': JSON.stringify(process.env.ENABLE_SERVICE_WORKER), 'process.env.STANDALONE': JSON.stringify(isStandalone ? true : false), 'process.env.VERSION': JSON.stringify(version), 'process.env.PLAUSIBLE_API': JSON.stringify(process.env.PLAUSIBLE_API), @@ -191,7 +189,6 @@ const makeWebsite = () => ({ template: './src/p4/template.ejs', chunks: ['p4'] }), - new GenerateServiceWorkerPlugin(), ...(isStandalone ? [new EagerDynamicImportPlugin()] : []), ...(process.env.BUNDLE_ANALYZER === 'p4' ? [new BundleAnalyzerPlugin()] : []) ],