Skip to content

Workbox v3.3.0

Compare
Choose a tag to compare
@jeffposnick jeffposnick released this 18 Jun 18:46

🎉 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/