コンテンツにスキップ

JavaScript ウェブワーカーによる並列処理

Usage

  • Workerはローカル環境では動作しない
  • Live Server等のVSコード拡張でサーバーを立てると動作確認できる

メインスレッド

main.js
const worker = new Worker("worker.js");

// workerへデータを送信
const obj = {id: 1, name: 'Tom'};
worker.postMessage(obj);

// workerからデータを受信
worker.onmessage = function(e) {
    console.log(e.data);
}

Worker

worker.js
// メインスレッドからデータを受信
onmessage =  function(e) {

    // do something
    const msg = 'message from worker';

    // メインスレッドへデータを送信
    postMessage(msg);
}

  • workerからDOM操作はできない

GitHub

Referenc