主要レイヤと代表ライブラリ
- WebGL — 2011 年 3 月正式公開
- Khronos Group が策定した、ブラウザから GPU にアクセスする OpenGL ES 2.0 ベースの API。WebGL 2(2017 年公開)で OpenGL ES 3.0 相当に。現在のブラウザ映像処理の土台。後継 WebGPU が 2023 年 Chrome で安定版化。
- Three.js — 2010 年 Mr.doob(Ricardo Cabello)
- WebGL を抽象化する 3D エンジン。シーン/カメラ/ライト/マテリアルという Unity / Unreal ライクな API で、3D 映像の制作ハードルを一気に下げた。GitHub スター 10 万超のデファクト。
- p5.js — 2013 年 Lauren McCarthy
- Processing(Ben Fry + Casey Reas, 2001〜)を JavaScript に移植した教育寄りのクリエイティブコーディング環境。アートスクール/ワークショップでの採用が多く、Hydra 以前の "ブラウザで映像" の定番。
- Hydra — 2017 年 Olivia Jack
- ブラウザでライブコーディング VJ ができる環境。WebGL framebuffer をアナログモジュラーシンセ風にチェーンし、WebRTC でピア配信可能。International Conference on Live Coding(2017)でワークショップ公開。オープンソース、URL を共有するだけで即パフォーマンスが成立する軽さで、ライブパフォーマンスの敷居を一段下げた。
- ISF (Interactive Shader Format) — 2013 年 VIDVOX 策定
- GLSL フラグメントシェーダに JSON メタを付けたオープン規格。現行 2.0。VJ ソフト/メディアサーバ/NLE 間でシェーダを共通フォーマットとして渡せる。200+ の公式シェーダがオープンソースで利用可能。VDMX / Resolume / MadMapper などが対応。
周辺の Web API
映像以外にも VJ を支える Web API が揃っています。Web Audio API(2011 年)はオーディオ解析のエンジン。AnalyserNode で FFT を取り、リアルタイムで音量・周波数スペクトル・オンセット検出を行えます。WebMIDI API(2015 年)で Launchpad や APC Mini を直接叩けるようになり、WebRTC(2013 年)でピアツーピアの映像ストリーミングが可能に。これらが揃って初めて「ブラウザ 1 枚で VJ」が完結します。
AUTOVJCLUB の技術スタックもこの系譜に乗っています。WebGL で映像描画、Web Audio API で曲認識用オーディオを取得(ACRCloud へ送信)、WebMIDI でコントローラー対応、ブラウザ間通信で別デバイスからの遠隔操作——Hydra の思想と地続きの設計です。