Web Workers API

 Web Workerとは、ウェブアプリケーションにおけるスクリプトの処理をメインとは別のスレッドに移し、バックグラウンドでの実行を可能にする仕組みのことです。時間のかかる処理を別のスレッドに移すことが出来るため、 UI を担当するメインスレッドの処理を中断・遅延させずに実行できるという利点があります。

Web Workerの概念と使い方

 Workerオブジェクトは Worker() などのコンストラクターで生成されるオブジェクトで、名前を持つ JavaScriptファイルを実行します。 Workerのスレッドで実行されるコードはこのファイルに書かれており、今いる windowとは別のグローバルなコンテキストの中で Workerがコードを実行します。Dedicated Worker (専用ワーカー) の場合、そのコンテキストは DedicatedWorkerGlobalScopeオブジェクトで表現されます (通常の Workerは単一のスクリプトで使用されますが、 Workerを共有する際は SharedWorkerGlobalScopeを使用します)。

 Workerのスレッドではあらゆるコードを実行できますが、いくつか例外があります。例えば、 Workerから DOMを直接操作することは出来ません。また、 windowにデフォルトで用意されているメソッドやプロパティには Workerから使用できないものもあります。しかし、 WebSocketsや IndexedDBのようなデータストレージに加え、 Firefox OSにおける Data Store APIなど、 windowに含まれていても使用できるものは数多くあります。詳しくは Workerから使用できる関数とクラス を参照してください。

 Workerとメインスレッドとの間では、メッセージのシステムを通してデータがやり取りされます。両者は postMessage() メソッドを使ってメッセージを送信し、受け取ったメッセージには onmessageイベントハンドラーで返信します (メッセージは Messageイベントの data属性に格納されます)。なお、送信したデータは受取先でコピーされます (共有ではありません)。

 メインスレッドのページと同じオリジンであれば、 Web Workersは新しい Workerをいくつでも生成できます。また、 Workerはネットワーク I/O において XMLHttpRequestを使用しますが、 XMLHttpRequestにおける responseXMLと channel属性は必ず null を返す点で通常と異なります。

 Dedicated Workerの他にも、 Workerの種類には以下のようなものがあります。