libsonare

日本語

English

日本語

English

Appearance

ブラウザ内ローカル処理 ​

ブラウザ内ローカル処理は、音声ファイルのデコードと処理をユーザー端末のブラウザ内で完結させる方式です。libsonare の各デモは、解析、ミキシング、リアルタイム FX、マスタリングのレンダリングのどれについても、ソース音声をサーバーへアップロードしません。

本格的な DSP（デジタル信号処理）を動かしながら、ユーザーの音声を端末の外に出さないように設計された構成です。

ローカルで完結する処理 ​

ブラウザデモでは以下がブラウザ内で実行されます。

  • ファイルデコードはブラウザの Web Audio API または WASM の Audio.fromMemory* ヘルパーで行う。
  • 解析、レンダリング、ミキシング、リアルタイム FX は、デモに応じてページ、Web Worker（UI を止めないためのバックグラウンドスレッド）、AudioWorklet（ブラウザのリアルタイム音声コールバック用スレッド）のいずれかで動く。
  • DSP は libsonare の WebAssembly モジュール内で動く。
  • WAV 書き出し、JSON レポート生成、可視化用データの生成もブラウザ内で完結する。
  • ソース、レンダリング結果、リファレンス、設定はローカルオブジェクトとして保持する。

ネットワークから取得するもの ​

ページ本体、JavaScript バンドル、WASM ファイル、Web フォントは、通常の Web サイトと同じくネットワークから読み込まれます。届くのはコードと見た目であり、あなたの音声はその中に含まれません。コードの読み込みが終わった後は、ソース、リファレンス、解析バッファ、レンダリング結果が処理のためにアップロードされることはないので、機密性の高い素材でも端末の外には出ません。

自分で確かめるには、デモのレンダリング中にブラウザの Network パネルを開きます。ページ、WASM ファイル、フォントの読み込みが終わった後は、音声を運ぶリクエストはありません。ブラウザ以外では、確認すべきサーバー側の部品がそもそもありません。Node パッケージ、Python パッケージ、CLI は、いずれも手元のプロセスでローカルのファイルに対してエンジンを動かします。

typescript
import { init, lufs } from '@libraz/libsonare';

await init();   // WASM ファイルを 1 回だけ取得します

// 以降の呼び出しはローカルの関数呼び出しで、ネットワークには出ません。
const { integratedLufs } = lufs(samples, sampleRate);
python
import libsonare as sonare

# エンジンは、Python プロセスに読み込まれるローカルの共有ライブラリです。
integrated = sonare.Audio.from_file("song.wav").lufs().integrated_lufs
bash
sonare lufs song.wav   # ディスクからファイルを読み、結果を表示します

トレードオフ ​

ローカル処理の利点:

  • アップロード待ちがない。
  • サーバー側にファイルが保管されない。
  • クレジットや順番待ちが発生しない。
  • 端末の外に出せない素材でも扱いやすい。

制約:

  • 長尺ファイルはユーザー端末の CPU・メモリ性能に依存する。
  • モバイルブラウザでは制限が厳しい場合がある。
  • 対応コーデックは OS／ブラウザによって差がある。
  • 端末側でレンダリングできなかった場合のサーバーフォールバックはない。

大きなファイルでレンダリングが遅いのは、サーバーの混雑ではなく、手元の端末の CPU とメモリが上限に達しているからです。短い区間で挙動を確認する、別のブラウザを試す、デスクトップ環境で実行する、といった対処になります。

実装メモ

デモは、必要に応じてデコード済みソース、レンダリング後の WAV、JSON レポート、リファレンス音源、エクスポート設定に object URL を作成します。これらはリモートのファイルではなく、ブラウザのローカルメモリ上のデータを指す URL です。差し替え時やコンポーネントのアンマウント時に解放し、メモリリークを防ぎます。プレビュー再生・WAV 書き出し・レポート保存はいずれもこの仕組みの上に乗っているため、音声ファイルがネットワーク経由でやり取りされる経路は持っていません。

レンダリング、リファレンスマッチング、重めの解析タスクは、必要に応じてモジュールワーカーで動きます。libsonare の WASM が重い処理を実行している間も、UI スレッドをブロックしにくくするためです。

リアルタイム FX では、音声コールバックの処理を AudioWorklet で実行します。

ワーカー内で例外が起きた場合も、UI 側で扱いやすいエラーオブジェクトに整形してから返します。長尺ファイルで失敗しても、ページ自体が固まらないようにするためです。

関連: エラー復旧、マスタリング品質チェックリスト、WASM