audio-dsp

オーディオ DSP スキル

Web アプリケーションでオーディオのデジタル信号処理を実装するための専門知識です。

使用する場面

• オーディオエフェクト（リバーブ、ディレイ、コーラス）の実装
• Web Audio API によるリアルタイムのオーディオ処理
• FFT 解析と可視化
• 畳み込みベースのエフェクト
• AudioWorklet の開発

Web Audio API のパターン

基本的なオーディオコンテキスト

const audioContext = new AudioContext();
const analyser = audioContext.createAnalyser();
analyser.fftSize = 2048;

AudioWorklet（リアルタイム処理）

// Register processor
await audioContext.audioWorklet.addModule('processor.js');
const node = new AudioWorkletNode(audioContext, 'my-processor');

一般的なアルゴリズム

畳み込みリバーブ

const convolver = audioContext.createConvolver();
const response = await fetch('/impulse-response.wav');
convolver.buffer = await audioContext.decodeAudioData(await response.arrayBuffer());

FFT 解析

const dataArray = new Float32Array(analyser.frequencyBinCount);
analyser.getFloatFrequencyData(dataArray);

ナレッジベースのリソース

DSP アルゴリズムを検索：

SELECT * FROM algorithm WHERE tags CONTAINS 'audio' OR tags CONTAINS 'dsp';
SELECT * FROM paper WHERE abstract @@ 'convolution reverb impulse';

パフォーマンスのガイドライン

1. リアルタイム処理には AudioWorklet を使用します
2. オーディオ処理中に メインスレッドをブロックしないでください
3. バッファサイズ：低レイテンシには 128～512
4. サンプルレート：デバイスに合わせます（通常は 44100 または 48000）
5. ワークレットとの通信には SharedArrayBuffer を使用します

React との統合

// Custom hook pattern
const useAudioAnalyser = (audioContext: AudioContext) => {
  const analyserRef = useRef<AnalyserNode>();
  
  useEffect(() => {
    analyserRef.current = audioContext.createAnalyser();
    return () => analyserRef.current?.disconnect();
  }, [audioContext]);
  
  return analyserRef;
};

関連するナレッジベースの検索

-- Find reverb implementations
SELECT * FROM knowledge WHERE content @@ 'reverb implementation';

-- Get validated algorithms
SELECT * FROM algorithm WHERE success_rate > 0.8;