Workbox v3.3.0

🎉 What's New?

Cache maintenance improvements

Two new features are available to help developers deal with cache maintenance, and in particular, storage quota errors.

First, a new deleteCacheAndMetadata() method has been added to the workbox.expiration.Plugin class. This can be called manually, and it will delete all entries in the cache that the plugin is associated with, as well as clear out all metadata related to cache expiration for the plugin instance. While it's always been possible to explicitly call caches.delete(<cacheName>), that would not clear out any expiration metadata, and could lead to unexpected expiration behavior the next time the cache was recreated. (#1500)

Next, a new purgeOnQuotaError parameter can be passed in when configuring workbox.expiration.Plugin. It defaults to false, but if set to true, you can opt-in to clearing all entries in a given cache (via a call deleteCacheAndMetadata() made automatically) whenever a quota errors occurs anywhere in Workbox. This allows you to mark certain runtime caches as being "safe" for automatic cleanup, clearing up room for your web app's more critical cache storage usage. (#1505)

Opting-in to this behavior explicitly in your service worker looks like:

workbox.routing.registerRoute(
  new RegExp('/images/'), // Change to the routing criteria you need.
  workbox.strategies.cacheFirst({
    cacheName: 'images',
    plugins: [
      new workbox.expiration.Plugin({
        maxEntries: 10,
        purgeOnQuotaError: true, // Opt-in to automatic cleanup.
      }),
    ],
  })
);

When using generateSW in a build tool along with the runtimeCaching option, you can achieve something similar with the following configuration:

generateSW({
  // ...other options...
  runtimeCaching: [{
    urlPattern: new RegExp('/images/'),
    cacheName: 'images',
    handler: 'cacheFirst',
    options: {
      expiration: {
        maxEntries: 10,
        purgeOnQuotaError: true,
      },
    },
  }],
});

Automatic cache cleanup is still in its early phases, and we encourage developers who use runtime caching (especially of opaque resources, which can lead to high quota usage) to give the new functionality a try, and provide feedback.

The fetchDidFail lifecycle event is passed a new error parameter

Developers using the fetchDidFail lifecycle event to write plugins which respond to a failed network request now have access to the original underlying exception, via the error property of the callback's parameter. (#1486)

More information is available in our Custom Plugins guide.

gzip'ed CDN assets

Users of the CDN copies of the Workbox runtime libraries will now benefit from Content-Encoding: gzip support, leading to smaller initial downloads. (#1523)

🐛 What's Fixed?

• Explicitly check whether ReadableStream is functional, and trigger non-streamed fallback logic when it's not, to workaround an issue with the current Edge build and workbox-streams. (#1476)
• Improve the code that swaps 'prod' for 'dev' in copyWorkboxLibraries. The new replacement logic is more robust when your destination path includes the string 'prod'. (#1488)
• The workbox-webpack-plugin integration tests are now run against webpack v4, instead of v3. (webpack v3 still remains supported; this only affects the test suite.) (#1492)

📖 Learn More

Check out our docs @ developers.google.com/web/tools/workbox/

Workbox v3.2.0

🎉 What's New?

A new workbox-streams module

The workbox-streams module provides an easy-to-use wrapper on top of the Streams API, allowing you to create a streaming response from a sequence of multiple sources.

The new module offers a convenience workbox.streams.strategy() method that can be used as a strategy in a workbox.routing configuration, allowing you to respond to matching requests with a stream:

const apiStrategy = workbox.strategies.staleWhileRevalidate();
const streamsStrategy = workbox.streams.strategy([
  () => caches.match('start.html'),
  () => `<p>Here's an API call, using a stale-while-revalidate strategy:</p>`,
  ({event}) => apiStrategy.makeRequest({
    event,
    request: '/api/date',
  }),
  () => caches.match('end.html'),
]);
workbox.routing.registerRoute(
  new RegExp('/index'),
  streamsStrategy
);

For more information and usage examples, please see the documentation and the live demo. (#1439)

Improved resiliency during unexpected cache misses

If a cache entry that would normally be used to fulfill a request is unexpectedly missing, workbox.routing.registerNavigationRoute() will now fall back to the network to obtain that response. Previously, this would lead to a failed navigation. (#1460)

precacheAndRoute() now accepts options in injectManifest mode

Previously, when using injectManifest mode with workbox-build or workbox-cli, the default regular expression would look for precacheAndRoute([]) inside of your swSrc file, and use that [] as the point at which to inject the manifest.

We've relaxed the default regular expression so that, in addition to supporting the previous usage, it will also work with precacheAndRoute([], {...}), where {...} are the options that you might want to pass in to configure precaching behavior. (#1459)

Changes to swSrc will trigger a new webpack dev server build

When using workbox-webpack-plugin's InjectManifest mode inside of a webpack dev server environment, making updates to the swSrc file will now trigger a fresh build. Thanks to @green-arrow for the contribution! (#1432)

🐛 What's Fixed?

• Resolved an issue with workbox.strategies.staleWhileRevalidate() and workbox.strategies.cacheFirst() in the Samsung Internet browser. (#1457)
• Moved to using the public compiler.inputFileSystem API when working with the webpack filesystem. Thanks to @DorianGrey for the contribution! (#1437)

📖 Learn More

Check out our docs @ developers.google.com/web/tools/workbox/

Workbox v3.1.0

🎉 What's New?

workbox-webpack-plugin offers more control over paths and filenames

New precacheManifestFilename and importsDirectory options were added to the webpack plugins, giving developers more control over where their generated files are saved.

When importWorkboxFrom: 'local' and output.publicPath is configured, the output.publicPath value will be prepended to the modulePathPrefix used to determine where the Workbox libraries are dynamically loaded from. This amounts to a change in the previous behavior, but based on developer expectation, the previous behavior was considered a bug.

See #1403 for more details about the change, and the documentation for the complete list of configuration options.

New makeRequest() method added to classes under workbox.strategies

Most developers will use one of Workbox's strategies as part of a router configuration. This setup makes it easy to automatically respond to specific fetch events with a response obtained from the strategy.

However, there are situations where making a request using a strategy outside of the standard router setup could be useful. For instance, you might be implementing your own routing logic, or you might want to create a composite response that contains information from multiple smaller responses, stitched together. There are also situations where you'd normally call fetch() directly, but you'd like to take advantage of the plugin integration offered by a strategy class.

See #1408 for more details.

🐛 What's Fixed?

• Use waitUntil only when it's available (#1392) (Thanks to @beatrizdemiguelperez for reporting the underlying issue: #1386)
• Correctly identify when response does not have date header set (#1422) (Thanks to @matthewjmay for identifying the issue and contributing the fix!)
• Properly deal with null cachedResponses passed to Range plugin. (#1427)

📖 Learn More

Check out our docs @ developers.google.com/web/tools/workbox/

Workbox v3.0.1

🎉 What's New?

• Webpack now logs errors when using glob patterns that are probably not intended to be used (#1380)
• Webpack supports absolute swDest paths (#1370 )

🐛 What's Fixed?

• Plugins for workbox-precaching setup for install and activate events. (#1367)
• workbox-precaching had an intermittent issue where the temporary cache was dropping requests (#1368)

📖 Learn More

Check out our docs @ developers.google.com/web/tools/workbox/

Workbox v3.0.0

Overview of Workbox V3

Workbox v3 has been focused on reducing the size of the library, while lowering the friction for usage. This has been accomplished thanks to a significant refactoring of the existing codebase. We believe the migration process for most users should be minimal, taking a few hours.

Developers are encouraged to view our documentation, including a migration guide for moving from either Workbox v2 or from sw-precache/sw-toolbox to Workbox v3.

Many thanks to @beatrizdemiguelperez, @raejin, @goldhand for contributing code for the v3 release, and to all the members of the community who tested and gave feedback during our alpha and beta periods.

🥅 High-level Goals for v3

Minimize the size of Workbox

The size of the Workbox libraries has been reduced. Instead of opting everyone in to a monolithic bundle, only code for the features you use will be imported at runtime.

Workbox has official CDN support

We provide a Google Cloud Storage-based CDN of the Workbox runtime libraries, making it easier to get up and running with Workbox.

Improved webpack Plugin

workbox-webpack-plugin integrates more closely with the webpack build process, allowing for a zero-config use case when you want to precache all the assets in the build pipeline.

Achieving these goals, and cleaning up some aspects of the previous interface that felt awkward or led to antipatterns, required introducing a number of breaking changes in the v3 release.

Better Debugging and Logs

The debugging and logging experience has been vastly improved. Debug logs are enabled by default whenever Workbox is used from a localhost origin and all logging and assertions are stripped from the production builds

🎉 New Functionality

workbox-build

• globFollow and globStrict added to workbox-build. This means symbolic links will be followed when searching for files and any errors discovered by glob will now throw. (#1104)

workbox-cli

• Support --injectManifest in the workbox-cli wizard. (#1171)

workbox-precaching

• workbox-precaching supports two new configuration options, cleanUrls and urlManipulation. By default cleanUrls is true and will append .html to a reqest when looking for a precache hit (i.e. /about will check for /about.html). urlManipulation can be a function enabling you to express a mapping between the server-side URL and the underlying local file. (#1154)

• If a precached request is not in the cache, we fallback to the network. (#1302)

• Precaching will store requests in a temporary cache on install and copy these requests to final cache during the activate step. (#1316)

• The precaching IndexedDB name is now derived from the cache name - allowing multiple precaches on a single origin. (#1346)

workbox-strategies

• Fallback to the network response whena network timeout is reached and there is no cache hitfor the network-first strategy. (#1301)
• Support for configuring fetch options in a strategy. (#1340)

workbox-webpack-plugin

• Adds support for webpack v4, while retaining support for webpack v3. (#1275)

• workbox-webpack-plugin now supports {test, include, exclude}-style filtering, providing an additional way of controlling which assets are included in the precache manifest. By default, assets matching /\.map$/ or /^manifest\.js(?:on)$/ are excluded. (#1149)

⚠️ Breaking Changes

Build Configuration

The following changes affect the behavior of all of our build tools (workbox-build, workbox-cli, workbox-webpack-plugin), which share a common set of configuration options.

• The 'fastest' handler name was previously valid, and treated as an alias for 'staleWhileRevalidate', when configuring runtimeCaching. It's no longer valid, and developers should switch to using 'staleWhileRevalidate' directly. (#915)

• Several runtimeCaching.options property names have been updated, and additional parameter validation is in place that will cause a build to fail if an invalid configuration is used. See the documentation for runtimeCaching for a list of currently supported options. (#1096)

• A new importWorkboxFrom option can be used to determine where the Workbox libraries are read from: the CDN, locally, or from a custom bundle (when using webpack).

workbox-background-sync

• There are significant changes to the API surface in v3. Developers should consult the documentation for current guidance. (#868)

• The maxRetentionTime configuration option is now interpreted as a number of minutes, rather than milliseconds. (#1268)

• The tag name is now used when responding to a sync event. (#1280)

workbox-build

• The default destination of a service worker for the CLI has changed from 'build/' to the location of the globDirectory (i.e. the directory searched for files to precache). (#1105)

• The getFileManifestEntries() function has been renamed to getManifest(), and the promise returned now includes additional information about the URLs which are precached.

• The generateFileManifest() function has been removed. Developers are encouraged to call getManifest() instead, and use its response to write data to disk in the appropriate format.

workbox-cache-expiration

• The plugin API has stayed the same, however there are significant API changes impacting developers who use it as a standalone class. Consult the documentation for the updated API surface. (#920)

• workbox-cache-expiration now throws an error if you attempt to expire entries on the default runtime cache (i.e. the shared cache used by all strategies by default). (#1079)

workbox-cli

• The set of command line options, and the way of reading in stored configuration, have all changed. Developers should consult the documentation or run the CLI with the --help flag for guidance. (#865)

• Support for the workbox-cli alias for the binary script has been removed. The binary can now only be accessed as workbox. (#730)

workbox-google-analytics

• While the API surface has not changed, the underlying implementation was updated to use the workbox-background-sync library, and therefore rely on the Background Sync API. (#244)

workbox-precaching

• The precache() method previously performed both the cache modifications and set up routing to serve cached entries. Now, precache() only modifies cache entries, and a new method, addRoute(), has been exposed to register a route to serve those cached responses. Developers who want the previous, two-in-one functionality can switch to calling precacheAndRoute(). This enables more developer flexibility. (#886).

• workbox-broadcast-update will no longer be automatically configured to announce cache updates for precached assets. To get this behavior, you can add the plugin manually. (#1073)

workbox-routing

• The Router will now evaluate Routes in a first-registered-wins order. This is the opposite order of Route evaluation that was used in v2, where the last-registered Route would be given precedence. (#845)

• The ExpressRoute class, and support for "Express-style" wildcards have been removed. This reduces the size of workbox-routing considerably. Strings used as the first parameter to workbox.routing.registerRoute() will now be treated as exact matches. Wildcard or partial matches should be handled by RegExps—using any RegExp that matches against part or all of the request URL can trigger a route. (#1012)

• The addFetchListener() helper method of the Router class has been removed. Developers can either add their own fetch handler explicitly, or use the interface provided by workbox.routing, which will implicitly create a fetch handler for them. (#914)

• The registerRoutes() and unregisterRoutes() methods were removed. The versions of those methods that operate on a single Route were not changed, and developers who need to register or unregister multiple routes at once should make a series of calls to registerRoute() or unregisterRoute() instead. (#856)

workbox-strategies (formerly know as workbox-runtime-caching)

• The workbox-runtime-caching module is now officially known as workbox-strategies, and has been published on npm under its new name. (https://github.com/GoogleChrome/workbox/issue...

Workbox v3.0.0-beta.2

🎉 What's New?

• Attempting to cache a POST request will no throw a useful WorkboxError (#1336)
• Adding support to configure fetch options in a Strategy (#1340)

🐛 What's Fixed?

• Fixes BroadcastChannel on Safari Tech Preview where it's not supported. (#1304)
• Fixes broadcastUpdate in workbox-build config (#1334)
• Precaching to a temp cache in install and moving to final cache during activate step (#1316)
• Precaching cache name is now defined from the cache name - allowing multiple precaching (#1346)

📖 Learn More

Check out our docs @ developers.google.com/web/tools/workbox/next/

Workbox 2.1.3

What's new?

The 2.1.3 release contains a few changes to the workbox-background-sync and workbox-broadcast-cache-update modules to ensure that they will not attempt to use the Broadcast Channel API on a browsers that lacks support for it.

Safari is one such browser.

Notable PRs

• Gracefully no-op when BroadcastChannel doesn't exist (#1291)

Workbox v3.0.0-beta.1

🎉 What's New?

• Webpack V4 (#1275 )
• [BREAKING CHANGE] Using BG Sync tag name when responding to a sync event (#1280)
• [BREAKING CHANGE] Use broadcastUpdate option instead of broadcastCacheUpdate (#1292)
• Using same-origin to precache URLS (#1293)
• Support for importWorkboxFrom: 'local' in the injectManifest Webpack Plugin (#1290)
• If a precached request is not in the cache, we fallback to the network (#1302)
• Add a warning if the cache-control header for the service worker is not set to no-cache or max-age=0 (#1317)
• Logs have been added to background-sync to aid development and debugging (#1323)
• New non-fatal warnings in workbox-build (#1325)

🐛 What's Fixed?

• import scripts including multiple precache manifests. (#1267) H/T @raejin for fix
• Fallback to network response when using a timeout but nothing is in the cache (#1301)
• Fixed logging in Safari Tech Preview (#1310)
• addRequest in background-sync now asserts you are passing in a Request object (#1305)
• google-analytics needed some fixes for replaying requests (#1319)
• Fixed importScripts in workbox-build (#1327)

Workbox v3.0.0-beta.0

The first beta release of Workbox v3 includes additional integration tests and demos, as well as the following developer-visible changes from the previous alpha release.

🎉 What's New?

• [BREAKING CHANGE] The background sync module's maxRetentionTime setting is now interpreted as a number of minutes, rather than milliseconds (#1268)

🐛 What's Fixed?

• Honor publicPath when determining the precache manifest URL. (#1233)
• Show the --help message when there are no params passed to workbox-cli. (#1242)
• Tweak wording for root of web app question. (#1243)
• Refactor the way CLI parameters are processed by workbox-cli. (#1246)
• Ignore .map when suggesting extensions to precache in the workbox-cli wizard. (#1255)
• Make workbox sw chunk prefix with public path (#1265) (Thanks to @raejin for their contribution!)

Workbox v3.0.0-alpha.6

The latest alpha release of Workbox includes some project health improvements, as well as the following developer-visible changes from the previous alpha release.

🎉 What's New?

• #1171 Support --injectManifest in the workbox-cli wizard.

🐛 What's Fixed?

• #1173 Properly deal with webpack's publicPath + importWorkboxFrom: 'local'
• #1181 Don't copy the same workbox-sw.js(.map) files twice
• #1203 Tweak async/await usage to avoid a bug in the final prod bundle.
• #1184 Switching to a db name instead of just a store name
• #1216 Call new on the corresponding Plugin class.