onnxruntime-web の自社配信は wasm 専用バンドル + wasmPaths オブジェクト指定で1ファイルに絞る
開発環境
フロントエンド
機械学習
知識
onnxruntime-web(v1.27 系)を CDN に頼らず自社アセット配信で使うときのハマりどころと構成:
- ルート import(
onnxruntime-web)の既定バンドルは WebGPU 対応の jsep 系 wasm(ort-wasm-simd-threaded.jsep.*)を要求する。wasm バックエンドしか使わないならサブパスonnxruntime-web/wasmを import する(納子 JS 内包の bundle 版が解決される) env.wasm.wasmPathsをディレクトリ文字列で指定すると、bundle 版でも glue の .mjs をそのディレクトリから動的 import しようとして失敗する(dev サーバーの変換や MIME の影響も受ける)。オブジェクト形式wasmPaths = { wasm: "/自社パス/ort-wasm-simd-threaded.wasm" }にすると外部ロードは wasm 1ファイルだけになる- SharedArrayBuffer 要件(COOP/COEP)を避けるなら
env.wasm.numThreads = 1 - 配布サイズ目安: wasm 約13.5MB(gzip で数MB)。モデルと合わせて遅延ロード(利用画面表示時に preload)+ ロード失敗時のフォールバック経路を用意する
- Vite 系(vitest browser 含む)では動的 import を伴うライブラリのため optimizeDeps.include に入れて mid-run reload を防ぐ
検証方法
ブラウザテスト(vitest browser 等)で「モデルロード→推論→期待出力」を回すテストを置くと、配信パス・バンドル選択の設定ミスが CI で検知できる。静的アセットの到達確認は fetch の HEAD で先に切り分けると原因特定が早い