JA EN

Web Worker

読み: うぇぶわーかー

ブラウザのメインスレッドとは別のバックグラウンドスレッドで JavaScript を実行する仕組み。重い画像処理でも UI がフリーズしない。

Web Worker はブラウザが提供するマルチスレッド機構であり、メインスレッド (UI スレッド) とは独立したバックグラウンドスレッドで JavaScript を実行できる。画像のピクセル操作やフィルタ適用など計算量の大きい処理をワーカーに委譲することで、UI の応答性を維持できる。

メインスレッドとワーカー間のデータ受け渡しには postMessage() を使用する。ImageData のような大きなバッファは Transferable Objects として転送すると、コピーではなく所有権の移動となりオーバーヘッドが最小化される。

一括圧縮ツールでは複数の Web Worker を並列起動し、画像ごとに独立したワーカーで圧縮処理を行うことで処理速度を向上させている。OffscreenCanvas と組み合わせれば、ワーカー内で直接 Canvas 描画が可能になり、Canvas API の処理をメインスレッドから完全に分離できる。

関連用語

関連記事