ブラウザ内でAIを動かす
推論をサーバではなく見ている人の端末で走らせる構成を、2つのプロダクトで使っている。
| プロダクト | 用途 | 使ったもの |
|---|---|---|
| サムネジェネレーター | 画像生成 | ONNX Runtime Web + SD-Turbo |
| Valscope | 文章の生成・要約 | @mlc-ai/web-llm |
どちらも共通する動機がある。サーバで推論すると、使われるほど金がかかる。 個人で運用するかぎり、そこが青天井になる構成は選べない。
何がサーバから消えるか
APIキーの管理も要らなくなる。鍵が無いので漏れない。
代わりに背負うもの
動く環境を選ぶ。 WebGPU が要る。対応していないブラウザでは何も動かないので、 機能を出す前に必ず判定して、使えないときの表示を用意する。
初回が重い。 サムネジェネレーターは初回に約1GBのモデルを取得して IndexedDB に置く。 2回目以降は即起動するが、最初の1回で離脱される。 ボタンを押すまで取得を始めない作りにして、押した人にだけ待ってもらう形にした。
端末の性能で結果が変わる。 同じ操作でも待ち時間が数倍違う。 「何秒で終わります」と書けない。進捗を出すことしかできない。
モデルの置き場所
モデルはリポジトリに入れない。サムネジェネレーターは HuggingFace から取得し、 IndexedDB にキャッシュしている。
配信サーバ側の役割はモデルを配ることだけになる。 サムネジェネレーターを Cloudflare Pages に置いているのはこのためで、 アプリ本体は静的ファイルしかない。
どちらを使うか
| ONNX Runtime Web | WebLLM | |
|---|---|---|
| 向くもの | 画像生成・分類など、変換したONNXがあるもの | 言語モデル |
| モデルの用意 | 自分でONNXに変換するか、変換済みを探す | 対応モデルの一覧から選ぶ |
| 手数 | 前処理・後処理を自分で書く | チャット形式のAPIが用意されている |
言語モデルを動かすなら WebLLM のほうが手数が少ない。 それ以外は ONNX Runtime Web を使うことになる。