Strategies

This is a simple class used to namespace the supported caching strategies in workbox-sw.

You would never access this class directly but instead use with workboxSW.strategies.<Strategy Name>.

Constructor

new Strategies()

This constructor will configure shared options across each strategy.

Parameters
input.cacheId String (Optional)

The cacheId to be applied to the run time strategies cache names.

Instance Methods

this.cacheFirst(options) CacheFirst

A cache first run-time caching strategy.

Example
const = new WorkboxSW();
const cacheFirstStrategy = workboxSW.strategies.cacheFirst();

workboxSW.router.registerRoute('/styles/*', cacheFirstStrategy);
Parameters
options StrategyOptions (Optional)

To define any additional caching or broadcast plugins pass in option values.

Returns CacheFirst

An instance of a CacheFirst handler.

this.cacheOnly(options) CacheOnly

A cache only run-time caching strategy.

Example
const workboxSW = new WorkboxSW();
const cacheOnlyStrategy = workboxSW.strategies.cacheOnly();

workboxSW.router.registerRoute('/styles/*', cacheOnlyStrategy);
Parameters
options StrategyOptions (Optional)

To define any additional caching or broadcast plugins pass in option values.

Returns CacheOnly

An instance of a CacheOnly handler.

this.networkFirst(options) NetworkFirst

A network first run-time caching strategy.

Example
const workboxSW = new WorkboxSW();
const networkFirstStrategy = workboxSW.strategies.networkFirst();

workboxSW.router.registerRoute('/blog/', networkFirstStrategy);
Parameters
options StrategyOptions (Optional)

To define any additional caching or broadcast plugins pass in option values.

Returns NetworkFirst

An instance of a NetworkFirst handler.

this.networkOnly(options) NetworkOnly

A network only run-time caching strategy.

Example
const workboxSW = new WorkboxSW();
const networkOnlyStrategy = workboxSW.strategies.networkOnly();

workboxSW.router.registerRoute('/admin/', networkOnlyStrategy);
Parameters
options StrategyOptions (Optional)

To define any additional caching or broadcast plugins pass in option values.

Returns NetworkOnly

An instance of a NetworkOnly handler.

this.staleWhileRevalidate(options) StaleWhileRevalidate

A stale while revalidate run-time caching strategy.

Example
const workboxSW = new WorkboxSW();
const staleWhileRevalidateStrategy =
 workboxSW.strategies.staleWhileRevalidate();

workboxSW.router.registerRoute('/styles/*', staleWhileRevalidateStrategy);
Parameters
options StrategyOptions (Optional)

To define any additional caching or broadcast plugins pass in option values.

Returns StaleWhileRevalidate

An instance of a StaleWhileRevalidate handler.

Type Definitions

StrategyOptions

StrategyOptions is just a JavaScript object, but the structure explains the options for runtime strategies used in workbox-sw.

See the example of how this can be used with the cacheFirst() caching strategy.

Example
const workboxSW = new WorkboxSW();
const cacheFirstStrategy = workboxSW.strategies.cacheFirst({
  cacheName: 'example-cache',
  cacheExpiration: {
    maxEntries: 10,
    maxAgeSeconds: 7 * 24 * 60 * 60
  },
  broadcastCacheUpdate: {
    channelName: 'example-channel-name'
  },
  cacheableResponse: {
    statuses: [0, 200, 404],
    headers: {
      'Example-Header-1': 'Header-Value-1',
      'Example-Header-2': 'Header-Value-2'
    }
  }
  plugins: [
    // Additional Plugins
  ]
});

Properties

cacheName String

Name of cache to use for caching (both lookup and updating).

cacheExpiration Object

Defining this object will add a cache expiration plugins to this strategy.

Sub-properties

maxEntries Number

The maximum number of entries to store in a cache.

maxAgeSeconds Number

The maximum lifetime of a request to stay in the cache before it's removed.

broadcastCacheUpdate Object

Defining this object will add a broadcast cache update plugin.

Sub-properties

channelName String

The name of the broadcast channel to dispatch messages on.

plugins Array.<plugins>

For any additional plugins you wish to add, simply include them in this array.

cacheableResponse Object

Specifies types of responses to cache by status codes, headers, or both.

Sub-properties

statuses Array.<Number>

An array of status codes to cache.

headers Array.<Object>

An array of header-value pairs for HTTP headers to cache. See the example, above.