オフスクリーンキャンバスを使ったJSのマルチスレッド描画 – スムーズなユーザー操作実現の切り札 - ICS MEDIA

OffscreenCanvas（オフスクリーンキャンバス）はWeb Workers（ウェブワーカー）を使用してWorkerスレッドで描画処理を行える機能です。負荷の高い描画処理をWorkerスレッドに移動することで、メインスレッドの負担が軽くなり、余裕ができます。これによりメインスレッドでスムーズなユーザー操作を実現できるようになり、ユーザー体験の向上が期待できます。本記事ではOffscreenCanvasについて機能と使い方を解説します。 ▲ OffscreenCanvasを使用したデモ。OffscreenCanvasを使用すると、Canvasへの描画負荷が高い場合でもスムーズなユーザー操作とCSSアニメーションの再生を実現できる JavaScriptでマルチスレッドに処理を実行できるWeb Workers OffscreenCanvasの説明の前に、まずはWeb Workersについて

[efcl]

OffscreenCanvasを使ったWorkerでの処理について

[shinki0121]

“れまでできなかったWorkerスレッドでの描画処理を実現できるOffscreenCanvas”

[keim_at_Si]

お。これはいいtips

[dexia2]

WebGLとかパーティクルでカクカクする体験が嫌だったので、早く普及してくれると嬉しいですね。

[yarumato]

“Chrome 69からOffscreenCanvasを標準で利用できる。JavaScriptにマルチスレッドの概念を導入しメインスレッド動作を阻害せず別スレッド動作できるWorkersはDOM操作不可”

[nismit]

Offscreen CanvasとWeb Workerのオフスクリーンレンダリング。現時点ではChromeのみサポート。Firefox/Safari辺りが対応したらWebGLの表現力がさらに上がりそう

[ryunosinfx]

Firefoxが対応したら考える。Firefoxがなー、Firefoxが対応しないからなー、残念だなー