原文: Beyond Offline ★ Mozilla Hacks – the Web developer blog on December 30, 2015 by Potch

これは私の個人的なブログの内容であるにもかかわらずMozilla Hacksとしての最初の投稿であり、Mozillianとしての最初の投稿でもあります！今月はずっとWeb Application Developer Initiative(WADI)のService Worker Cookbook projectに取り組んでいました。Service Worker Cookbook projectは私にService Workersの専門知識をアウトプットする機会を与えてくれて、それと同時にこのエキサイティングな新しいWebテクノロジーを活用する方法を学ばせて くれました。私の考えをシェアしてみませんか。

このシリーズの以前の投稿に私の同僚のDavid WalshがApplication Cacheの柔軟性の欠如について話しています。なので私はこのトピックについて詳しく掘り下げません。私はService Worker Cookbookのレシピの詳細を見ていこうかと思います。DavidはService Workerの導入といくつかのoffline recipesについて議論してくれました。私はもう少し広げてService Workerのほかの使い方についてみていこうかと思います。

今日におけるServiceWorker

まだ開発下であるにもかかわらず、Service Workersは世界中で使われていると聞き始めています。

最初の取り組みは、ナビゲーションコントロールの概念を導入することになりました。これは後にService Worker の fetch functional event の概念へと成長しました。つまり、ネットワークへ向かうリクエストを乗っ取り、ネットワークまたはデータベースより得たデータ、もしくは手続きに従って生成されたデータを返すやり 方です。良い点は？制御されているページは、乗っ取られていることを知る必要がないので（知らせを受け取ることは可能です）、サービスロジックは完全にア プリケーションロジックから切り離されています。完全な”中間者”です。

しかしハッカー（結局これもハッカーブログだからね！！）として、私たちが好むのは、そうすることが適切である問題に対しては「まっとうでない」解決策を 作ることで、時として「まっとうでない」とはあるものの使い方がその本来の目的とは異なっていることを意味します。Mozilla では WADIと Firefox OS initiative が Service Worker の次に挙げるような、本来の用法とは異なる使い方を探っています。

APIの解析

MitMアプローチの直接的な応用をやってみましょう：API analytics

あなたはAPIの使用方法の統計がほしい、そしてサーバーにアクセスできないと想定しましょう。従来の解決方法はクライアントコードに手を加え、HTTPリクエストを作成し適切なログをanalytics serviceに送信します。Service Workerは一枚上手で、それぞれのリクエストを捕まえて引数を抽出し、解析に備えてログを送信した上で、元の形のリクエストがネットワークに到達するようにできます。

パッケージ化されたアプリのインストール

他のユニークな使い方を探る前に、伝統に従いましょう。
Service Workerは installing packaged applicationsを 使いオフラインのリソースが使用できます。これはzipパッケージとしてダウンロードし、Service Worker有効時に解凍することができます。これはそれぞれのHTTPリクエストのオーバーヘッドを減らし、原始的な（一度の）操作によってダウンロー ドすることが可能です。フォントや画像などの静的なオフセットの自動キャッシュは”offlining”の良い例であり良い方法です。

サーバーを偽装する

上記のServiceWorkerがプロキシとして動作するMitMアプローチをもう一度考えて見ま しょう。ServiceWorkerはサーバーを偽装し、クライアントがネットワークを通して期待するAPIを実装することができます。Service workerはクライアントがネットワークを通して届いてほしいAPIを実装することもできます。

impersonate a serverライブラリはFirefox OSで開発されていて New Gaia Architecture と呼ばれるものをサポートしています。
New Gaia Architecture はアプリケーションや開発者にService Workers in a declarative way で記述することを許可し、Express （Node.jsのライブラリ）のクライアントサイドで動く環境をサポートしています。

機能的な現代のフレームワークを実装する。

Service Worker はモダンなフレームワーク用の構成要素として、独自の位置づけを確保しています。
例として、template interpolationを考えてみます。backbone.js や Angularのような現在のポピュラーなウェブアプリ用のフレームワークの多くは、テンプレートにプロパティを補間することで、モデルから動作するもの を作り出しています。上で述べた New Gaia Architecture では、render storeという概念を導入しています。これはオフラインキャッシュであり、テンプレートのデータモデルを補間した結果を格納しておきます。再びクライアント が同じモデルをリクエストしたときにはレンダーストアから取り出すことで、補間にかかる時間を節約することができます。

Dependency injection

現代的なフレームワークの他のポピュラーなコンセプトに dependency injectionがあります。これは依存するコードが依存関係を知る必要は無い状態です。

これは抽象的なインターフェースのみ知っていて、詳細な仕様はinjectorと呼ばれるabstract factoryから提供されます。Service Workerはinjectorとして動作します。

フレームワークはスクリプトタグを経由してそのコンポーネントのAPIの依存関係を宣言させます。その後Service Workerはinjectorとして動作し、抽象的なリソースのリクエストを特定して、実際のモジュールを返却します。

リクエストの遅延

もしデバイスが connectivityを持っていなくて、しかし連続して操作を受け入れていると最終的にクライアントアプリケーションやサービスが非同期になってしまいます。

フレームワークの面白い特徴としてリクエストの遅延をすることができます。例としてオフライン時のサービスworkerはAPIのリクエストを保留して接続が来たときにリクエストを解き放つことができます。

一方でServiceWorkerはクライアントにgeneric OK (status code 200)やACCEPTED (status code 202)などの サーバーの応答を模倣することができます。コネクションが復帰するとServiceWorkerはdeferred requestsキューからネットワークに対してリクエストを再作成し同期します。

Network logic のアイデア

最 後に、Service Workerはnetwork logicを含むこともできます。たぶんmultiplexing リクエストを複数のソースに使用することもできるでしょう。可用性や計測やそれぞれの正しいチャンネルを通り、返ってきたデータソースの質の計測もできま す。
結論を出す前に小さい例を挙げましょう。ユーザーはHDの動画を見たいため、アプリケーションは動画のURLをリクエストしま す。しかしコンテンツの提供が始まる前に、ServiceWorkerがリクエストを妨害し、サーバーにサーバー自身のロードレベルを聞きに行きます。一 番低いボリュームを選択し、その特定のサーバからコンテンツを提供開始します。なにか気づかないか？そう、これはロードバランサーだ！今はクライアント側で使える！すごいとは思わないか？

最後に

今はこれくらいにしておきましょう。7つの使い道、単にオフラインで使用するためにコンテンツをキャッシュするだけを超えた7つのユニークなレシピ。現在、 Service Worker Cookbook projectはService Workers APIによって提供される特徴を活用するためこれらのすべての（そのほかにもある）方法を公開しています。

そして私たちはここでとまらず、先へ行く。
Push API  は定着し、 Background Sync ももうすぐです。
Service Workersの更なる情報や他のプラットフォームでの実装状況はPlatatusを参照してください。私たちはあなたの参加を待っています！