BPM Counter 2

BPM Counter Onlineとは

BPM Counter Onlineは、ブラウザ上で動作するWebアプリで、音声をリアルタイムに解析してBPM（ビート・パー・ミニット）を測定する機能を持っている。利用者は、ブラウザのマイクを通じて音声を取得し、その音声を用いてテンポを計測することができる。URLはこちらとなる。

技術的特徴

BPM Counter Onlineには、いくつかの技術的な特徴がある。

音声入力の取得

まず、音声の取得には、ブラウザのgetUserMedia APIを利用している。このAPIにより、ユーザーのマイクから音声をリアルタイムでキャプチャすることが可能。同時に、音声処理に関する負荷を軽減する設計がなされており、ユーザー体験を向上させている。

音声処理のスレッド化

音声処理はメインスレッドをブロックしないように、AudioWorkletNodeを使用してオーディオ収集を別スレッド化している。これにより、リアルタイムでの音声解析を可能にし、ユーザーの操作感を損なうことがない。また、BPM解析自体もWeb Workerに委譲することで、さらなるパフォーマンス向上が図られている。

BPM解析エンジン

BPMの解析エンジンには、Essentia.jsのWASM版を採用している。このライブラリはCDN経由でロードされ、非常に高精度なテンポ推定を実現している。具体的には、RhythmExtractor2013というマルチフィーチャーアルゴリズムを使用している。

リサンプリング処理の実装

異なるサンプリングレートの音声データに対応するため、自前で線形補間によるリサンプリング処理を実装している。この機能により、様々な音声環境においても正確なBPM解析が可能となる。

Auto Gain機能

音量の差が大きい入力環境に対応するため、「Auto Gain」機能を搭載している。これにより、振幅レベルに応じてゲインを段階的に調整できる。さらに、手動でのゲイン調整も行えるため、ユーザーのニーズに応じた柔軟性を持つ。

波形の視覚化

波形はCanvas 2Dを用いて常時描画されている。静止波形とスクロール波形の2種類が用意されており、視覚的に入力状況を確認できる。これにより、ユーザーはより直感的に音声入力の変化を把握できる。

画面スリープの防止

Wake Lock APIを使用して、計測中に画面が消えないような設計がなされている。これにより、ユーザーが音声を入力している最中に画面がスリープしてしまうことを防ぎ、計測が円滑に行える。

メモリ管理

WASM側で確保したメモリ（Vectorオブジェクト）に関しては、都度明示的に解放される実装がなされている。これにより、WASMメモリリークを防ぎ、安定した動作が実現されている。

まとめ

BPM Counter Onlineは、ブラウザ上で手軽にBPMを測定することができるアプリであり、多様な技術が組み合わさっている。その特徴には、高速かつ高精度な音声解析に必要な複数の技術が含まれており、柔軟性も兼ね備えている。ユーザーは、リアルタイムでの音声入力を楽しみながら、BPMを正確に測定できる。