はじめに
GMOコネクトの永田です。
前回に引き続き、Tensorflow.jsをさわっていきます。
前回はNode.jsで実行していましたが、今回からブラウザで動作させてみます。
ブラウザ版は機械学習のBackEndに色々と選べるため、それぞれどう性能に影響するのか気になったので、調べてみました！
Tesorflow.jsの公式ページにもある程度性能比較の情報があるのですが、WebGPUの情報がなかったりかなり古い機種( 2018 MacBook Pro )だったりしたので、実測します。
測定条件は、いつもの通り以下です。
- MacBook Pro, Apple M4 Max, メモリ36GB
- GAN（前回のモデル）、MNIST 40,000件
- ブラウザ: Chrome 140.0.7339.133（Official Build） （arm64）
まとめ
- tfjs Backendのデフォルトの
webglでも十分高速-
webgpuにするとさらに1.7倍高速に！
-
-
cpuな環境の人は少なくともwasmにしよう- ただ、WebGL or WebGPUが動作するPCへの買い替えを強く推奨
WebGPUとは？
WebGLはみなさん聞き慣れていると思いますが、WebGPUって？という人も多そうなので、Claude Sonnet4に聞いてみました。いつも通り雑なpromptです。
WebGPUとは？ WebGLとの比較。機械学習への影響は？
回答からポイントを抜粋します。
- 汎用GPU計算（GPGPU）が可能
- 並列処理による高速な行列演算
- 推論速度: WebGLと比較して2-3倍高速化
なんか期待が出来そうな内容ですね！
Node.js版Tensorflow.js GAN学習をブラウザ版へ改修
では、早速前回のNode.js版をブラウザ版に改修していきます。
いつも通り、Github Copilit Agent（Claude Sonnet4）にお任せします。いつも通り雑な（略
tfjs-gan(Nodejsで実行)を元に、Browser(Chrome, Firefoxなど)で動作するプログラムをtfjs-gan-browserに作成。
・canvasは、HTML上のcanvasで実現。
・ファイル出力はBlobでのファイルダウンロードで実現。
・ファイル入力はinput type=fileで実現。
出来ました！ こんな感じです。簡単ですね。
（少し手直ししましたが、9割以上はClaude Sonnet4が作成したままです）
Tensorflow.jsでのBackEnd毎の実測値
Tensorflow.jsのBackendによっては追加のライブラリが必要なので、予め組み込んでおきます。なお、今回の条件であれば既存の学習ロジックはどのBackendでも共通して利用でき、特に改修は不要でした。お手軽に導入できますねぇ😊
<!-- TensorFlow.js -->
<script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@4.22.0/dist/tf.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs-backend-webgpu@4.22.0/dist/tf-backend-webgpu.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs-backend-wasm@4.22.0/dist/tf-backend-wasm.min.js"></script>
では、計測していきましょう。
以下のようにブラウザのConsoleで直接Backendを変えながら測定していきます。
await tf.setBackend('cpu')
tf.getBackend() // 念の為Backendが変更されたか確認
| backend | Epochあたりの学習時間 | memo |
|---|---|---|
| cpu | 114秒/epoch | @tensorflow/tfjsのみで利用可能 |
| wasm | 56秒/epoch | @tensorflow/tfjs-backend-wasmが追加で必要 |
| webgl | 6秒/epoch | @tensorflow/tfjsのみで利用可能。WebGLが有効な環境ではデフォルトでこれになる。 |
| webgpu | 3.5秒/epoch | @tensorflow/tfjs-backend-webgpuが追加で必要 |
CPUの速度はやばいですね😇
PCを買い替える方が手っ取り早いレベルです。どうしても！ならWASMを採用してもらうぐらいでしょうか。
WebGPUは多少早くなるかな？と思っていましたが、WebGL比で1.7倍ぐらい高速化されています！
既存のロジックもそのまま使えるため、利用できる環境であれば積極的に採用しても良さそうですね。
（再掲）まとめ
- tfjs Backendのデフォルトの
webglでも十分高速-
webgpuにするとさらに1.7倍高速に！
-
-
cpuな環境の人は少なくともwasmにしよう- ただ、WebGL or WebGPUが動作するPCへの買い替えを強く推奨
弊社では、機械学習・AI・LLMなどを使ったサービスの開発や技術支援をはじめ、幅広い支援を行っておりますので、何かありましたらお気軽にお問合せください。