Web Worker


JavaScriptマスタースレッド
単一スレッドを使用するJavaScriptは、指定された時間に1行のコードしか実行できません.実行する必要があるタスクがキューに追加され、ブラウザのJavaScriptエンジンによって1つのタスクが一度に実行されます.
JavaScriptのシングルスレッドモードでは、ブロックというパフォーマンスの問題が発生します.プライマリ・スレッド内の特定のタスクを完了するには時間がかかり、他のすべてのタスクが実行できない場合に発生します.
ブロックするとWebプログラムの速度が遅くなり、ダウンタイムになることがあります.ユーザーはこれらの状況が不便だと感じます.😥
ネットワーク労働者
Web Workerでは、メインスレッドとは異なるバックグラウンドスレッドスクリプト操作をWebプログラムで実行できます.
すなわち,長時間のタスクをバックグラウンドスレッドに転送して処理することで,プライマリスレッドのブロックしない動作を最大限に低減でき,ユーザの不便を低減できる.😆
UI Blockを回避するためにバックグラウンドスレッド上で煩雑な演算を実行するために使用されます.
Web Workerの作成
Web Workerを作成するには、JavaScriptファイルのパスをWorker作成者に渡すだけです.
// index.js
const wroker = new Worker('worker.js')
ネットワークワーカー通信
プライマリ・スレッドとネットワーク・ワーカーは、メッセージ・システムを介してデータを相互に伝達します.
Web Worker APIは、PostMessageを介してメッセージを送信し、onMessageを介してメッセージを受信する.
// index.js
worker.postMessage(data);
worker.onmessage = (e) => console.log(e.data);

// worker.js
self.postMessage(data);
self.onmessage = (e) => console.log(e.data);
Web Workerを終了
// index.js
worker.terminate();

// worker.js
self.close(); 
ネットワーク作業の制限
  • ネットワークワーカーはDOMを直接操作することができず、windowオブジェクトへの方法と属性へのアクセスが制限されている.
  • オペレータは、ファイルシステム上で直接実行できず、サーバのみで実行できます.