Web Workersとは
対応ブラウザ
※Windows 7上で動作確認を行っています。
※ブラウザの設定より、異なる挙動をする場合があります。
※ブラウザにWeb Workers自体が実装されている場合に「○」としています。個々のメソッドや属性などについては未実装である場合があります。
解説
通常、ウィンドウやタブ、フレームなどのドキュメントの実行・閲覧の単位(ブラウジング・コンテキスト)ごとに、JavaScriptの処理の流れは一つだけで、前の処理が終わるまで次の処理に進むことはできません。このため、コード上で時間のかかる処理を行うと、その処理が終わるまでの間、ユーザーとのやり取りが中断されてしまいます。
Web Workersを利用すると、バックグラウンドで、ワーカーと呼ばれる独立した処理を走らせることで、ユーザーとのやり取りを邪魔することなく、時間のかかる処理を並行して行うことができるようになります。
ワーカーは、起動時に指定されたURLに存在するスクリプトの内容を、バックグラウンドで実行します。現在のところ、あらかじめファイルに記述した内容以外を実行することはできません。
ワーカーとの間で行われる、処理の依頼や、処理結果の受け取りなどのやり取りは、イベントを用いて非同期で行います。
ワーカーには専用ワーカーと共有ワーカーとがあり、メッセージのやり取りが可能な相手がそれぞれ異なります。専用ワーカーでは、そのワーカーを起動したコードとしかやり取りを行うことができません。それに対して、共有ワーカーでは、複数の接続とやり取りを行うことができます。
以下は専用ワーカーの例です。
// ドキュメント側のコード
// ワーカー起動
var worker = new Worker('backend.js');
// メッセージの非同期での受信(ワーカー側の送信のタイミングで呼ばれ、随時受信を行う)
worker.onmessage = function(event){
console.log(event.data);
}
// メッセージの非同期での送信(返信や結果を待たない)
worker.postMessage('送信データ');
ワーカー上で実行されるコードには、ドキュメントと独立して実行されるという性格から、windowやdocumentをはじめとして、HTMLドキュメント関連のオブジェクトにはアクセスできないという制限があります。ワーカー上のコードからアクセス可能なオブジェクトや属性は、専用ワーカーと共有ワーカーでも異なります。詳細はワーカー上で動くコードを実装するには?を参照ください。
また、同期処理を行うAPI(File APIのFileReaderSyncなど)は、処理の完了を待つ必要があるため、ユーザーとのやり取りを邪魔しないように、ドキュメント側のコードでは使用できないようになっていますが、ワーカー上のコードでは使用することができます。
関連項目