[WEB App] OPL3 Player v1 — Nuked-OPL3 WASMとAudioWorkletによる OPL3 WebAudioプレイヤー
![[WEB App] OPL3 Player v1 — Nuked-OPL3 WASMとAudioWorkletによる OPL3 WebAudioプレイヤー](https://assets.lain-lab.com/images/uploads/opl3-player.webp)
OPL3 Player
PC/AT互換機やDOS時代のサウンドを象徴する FM音源チップ OPL3（YMF262） のレジスタダンプファイル（.dro）をブラウザ内で高精度のまま再生するWebAudioプレイヤー。
高精度エミュレータである Nuked-OPL3 を WebAssembly 化し、音声合成処理を専用の AudioWorklet スレッドへオフロードすることで、メインUIの操作やアニメーションに影響されない安定した再生を実現しています。
OPL3 Player
Nuked-OPL3 WASMとAudioWorkletによる.dro (OPL3) WebAudioプレイヤー。
lain-lab.comSound BlasterとYamaha OPL音源の歴史
![[Computer] DOOMやSimCity 2000の音。90年代DOS/V PCを支配したSound BlasterとYamaha OPL音源の歴史 // PROTOCOL.LAIN](https://assets.lain-lab.com/images/uploads/computer-sound-blaster-opl-history.webp)
[Computer] DOOMやSimCity 2000の音。90年代DOS/V PCを支配したSound BlasterとYamaha OPL音源の歴史 // PROTOCOL.LAIN
80年代末のPC Speakerからの脱却、AdLibの登場、Sound BlasterによるFM音源＋8bit/16bit PCMの統合、Yamaha OPL2/OPL3（YM3812/YMF262）の技術仕様、そしてWaveTable移行と物理チップの消滅まで。90年代PCオーディオ史を徹底解説。
lain-lab.comスクリーンショット
プレイヤーUI — ドロップ待機状態（イコライザパネル・アバウト領域）
プレイヤーUI — 再生中（プレイリスト・ファイル情報・リアルタイムオシロスコープ波形描画）
動画（GIF）
再生・ビジュアライザ操作
Sample data
音声サンプルは「MSX Resource Center」様よりお借りしてます。
RoboIMF - DRO, RAW and IMF music file player | MSX Resource Center
IMF, DRO and RAW player for MSX. See this newspost for information Upload history: 20180214 ersion 1.1 20171102 version 1.0 AttachmentSizeDownloadsLast dow
www.msx.org特徴
- Nuked-OPL3 高精度エミュレーション — 実機に忠実なサイクル精度を誇る Nuked-OPL3 コアを WebAssembly 化
- AudioWorklet スレッド分離 — 音声生成処理をメインスレッドから分離し、UI描画負荷による音飛びを全廃
- サンプル単位の精度管理 — 128サンプルのブロック境界に依存せず、イベント発生タイミングに合わせてPCM生成を分割実行
- リアルタイム波形ビジュアライザ — WebAudio の AnalyserNode を活用したオシロスコープ表示
- 10バンド イコライザ — 周波数帯ごとのゲイン調整とプリセット設定対応
- ブラウザ完結処理 — 音声ファイルやデータを外部サーバーへ送信せず、ブラウザ内のみで解析・合成
使い方
1. 音楽ファイルを読み込む
画面左上のドロップエリアに .dro ファイル（または .imf ファイル）をドラッグ＆ドロップするか、エリアをクリックしてファイルを選択します。
2. 再生コントロール
ファイルを読み込むと自動的にプレイリストに追加され、再生が開始されます。 画面左下のコントロールパネルから以下の操作が可能です。
| コントロール | 説明 |
|---|---|
| 再生 / 一時停止 | 曲の再生・ストップを切り替え |
| シークバー | 再生位置の変更 |
| Speed | 再生速度の調整 |
| Master Volume | 出力音量の調整 |
| Visualizer Mode / Color | 波形描画（Waveform等）の切り替えおよびカラー変更 |
3. イコライザを調整する
画面右側の「EQUALIZER」パネルで音質をカスタマイズできます。
| 設定項目 | 説明 |
|---|---|
| ON / OFF スイッチ | イコライザの有効 / 無効切り替え |
| Preset | Flat などのプリセット選択 |
| スライダー (64Hz〜16kHz) | 各周波数帯のゲイン調整 |
| Reset | 各フェーダーの値を初期位置（0dB）に戻す |
対応入力フォーマット
| フォーマット | 拡張子 | 説明 |
|---|---|---|
| DOSBox Raw OPL | .dro | DOSBox等が出力する OPL2 / OPL3 レジスタダンプ形式（v0.1 / v2.0） |
| Id Music Format | .imf | ID Software系ゲーム等で使用された OPL2 ダンプ形式 |
技術スタック
- Nuked-OPL3 — C言語で実装されたサイクル精度 OPL3 エミュレーションコア
- WebAssembly / Emscripten — C言語コアのブラウザ実行モジュール化
- Web Audio API (AudioWorklet) — 低遅延・非同期での音声合成スレッド実行
- Three.js / Canvas API — リアルタイム波形ビジュアライズ描画
- Astro — Web アプリケーション基盤
技術記事
![[Astro] #132 OPL3 Player v1 - Nuked-OPL3 WASMとAudioWorkletで.dro (OPL3) プレイヤーをゼロから実装した記録](https://assets.lain-lab.com/images/uploads/astro-132-dro-player-nuked-opl3.webp)
[Astro] #132 OPL3 Player v1 - Nuked-OPL3 WASMとAudioWorkletで.dro (OPL3) プレイヤーをゼロから実装した記録
Nuked-OPL3のエミュレーションコアをWASM化し、AudioWorklet経由で.droファイルを再生するWebAudioプレイヤーの開発記録。関数名の難読化や非同期キュー、128サンプル境界での精密同期バグの克服を解説。
lain-lab.com更新履歴
- [v1.0] (2026-09-07): 初回公開。
- Nuked-OPL3 WASM コアによる OPL3 音源合成エンジンを実装
- DOSBox
.droファイル（v1.0 / v2.0）のバイナリパース対応 - AudioWorklet スレッドによる独立再生エンジン構築
- 10バンド イコライザおよびオシロスコープ波形ビジュアライザ搭載