【javascript】webworkerについて

こんにちは！ ampなどに使われるwebworkerについて気になったのでまとめてみました。

javascriptをマルチスレッドで処理を行えるようにした、web api の一つです。
メインスレッドを止めることなくjavascriptを利用できるようになります。
オブジェトを送り合う「メッセージング」と呼ばれる機能を利用しています。

・ampのamp-scriptコンポーネント
・(やったことないけど、vueでも使うことあるみたい)

メリット
・メインスレッドを妨げずにjavascriptを利用できる
デメリット
・アクセスできないオブジェクトがある

利用可能	不可能
navigator location XHR	window document DOM

①ワーカーを作成

const worker = new Worker('worker.js');

②メッセージ送信

worker.postMessage('Hello');

③worker.js側でメッセージを受信

self.addEventListener('message', (message) => {
    console.log(message.data);
});

など。

ちなみにサーバー立てないとエラーを吐きます。
https://teratail.com/questions/167546

tamakipedia