TL;DR JavaScriptとWebAssemblyの間の値渡しには気を使おう(なるべく値のコピーを避けよう)。 JSはとても高速で、単純なループではWASM並の速度が出るので、WASMの使い所はよくよく考えるべき。 はじめに 1000^2級の画像の全ピクセルをループして、(簡単に言うと)RGBA値の最も大きい値を抽出する、という処理をブラウザ上で突然したくなりました。ピクセル数が1,000,000だと、RGBAなので配列長は4,000,000となります。ブラウザで扱いたくないサイズ感です。 ここで、①WASMで高速化、ダメなら②サーバーサイドで計算させる…という算段をして、とりあえずWASMを試してみました。色々チューニングした結果、ブラウザ上で現実的な速度が出ることがわかりました(数十msの世界)。 RGBA値の計算について 本記事では深く説明しませんが、今回やりたい処理は「下記式