PWA: Workbox Core 和訳

Workbox Core

参照元ページ: https://developers.google.com/web/tools/workbox/modules/workbox-core

Workbox Coreとは?

(すべてのファイルや機能が入った)単一のファイルをダウンロードせすに、ディベロッパーが必要なモジュールファイルのみを選んで使用できることを目的にWorkboxは作られました。

しかしながらモジュール間に重複した部分があります。例えば、各モジュールはコンソールを操ったり、意味のあるエラーやネットワーク、キャッシュを利用します。それぞれのモジュールが行なっている共通のロジックの実装を避けるために、workbox-coreはコードの共有化を行なっています。

workbox-coreはディベロッパーに機能を提供しますが、(ログやキャッシュのみではなく)ディベロッパーのためというよりむしろ各々のモジュールに対して内部で利用できるロジックを提供しています。

デフォルトのキャッシュの名前を確認し変更する

Workboxはworkbox.core.cacheNames経由でキャッシュを定義します。

console.log(workbox.core.cacheNames.precache);

console.log(workbox.core.cacheNames.runtime);

console.log(workbox.core.cacheNames.googleAnalytics);

これらのキャッシュ名はprefix(接頭辞)、名前、suffix(接尾辞)のパーツで組み立てられます。名前はキャッシュの利用に基づいて変わります。

<prefix>-<cache id (precache | runtime | googleAnalytics)>-<suffix>

デフォルトの命名規則はsetCacheNameDetails()に渡す値で変更可能です。

workbox.core.setCacheNameDetails({
  prefix: 'my-app',
  suffix: 'v1',
  precache: 'install-time',
  runtime: 'run-time',
  googleAnalytics: 'ga'
});

// Will print 'my-app-install-time-v1'
console.log(workbox.core.cacheName.precache)

// Will print 'my-app-run-time-v1'
console.log(workbox.core.cacheName.runtime)

// Will print 'my-app-ga-v1'
console.log(workbox.core.cacheName.googleAnalytics)

もしあなたがWorkboxを複数のプロジェクトで使っており、それぞれのプロジェクトが同じlocalhostを使用している場合、prefixとsuffixを使用することでプロジェクト間のキャッシュのコンフリクトを回避することができます。

Skip Waiting and Clients Claim

新しいサービスワーカーを配信して、即座にウェブページをそのサービスワーカーのコントロール下におきたい場合があります。（それはデフォルトのサービスワーカーのライフサイクルをスキップすることになります）

下記のように書くことでworkbox-coreが、ライフサイクルを簡単にスキップさせてくれます。

workbox.core.skipWaiting();
workbox.core.clientsClaim();