Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
WebAudio
Search
Tiffany Conroy
October 01, 2012
Programming
1
190
WebAudio
GET EXCITED AND PLAY!!
Tiffany Conroy
October 01, 2012
Tweet
Share
More Decks by Tiffany Conroy
See All by Tiffany Conroy
Beautiful Authentication: Tear down the barbed wire
theophani
3
850
Lions and tigers and handling user capabilities
theophani
1
710
What about the CSSOM?
theophani
3
540
Cutting the fat
theophani
4
620
When to use Ajax and when to reload
theophani
6
1.8k
Version Control All The Codes
theophani
12
1.3k
Design Processes, Not Interfaces
theophani
5
1.8k
Other Decks in Programming
See All in Programming
tsgolintはいかにしてtypescript-goの非公開APIを呼び出しているのか
syumai
7
2.4k
AtCoder Conference 2025
shindannin
0
870
C-Shared Buildで突破するAI Agent バックテストの壁
po3rin
0
430
Flutter On-device AI로 완성하는 오프라인 앱, 박제창 @DevFest INCHEON 2025
itsmedreamwalker
1
170
まだ間に合う!Claude Code元年をふりかえる
nogu66
5
920
Deno Tunnel を使ってみた話
kamekyame
0
300
AI時代を生き抜く 新卒エンジニアの生きる道
coconala_engineer
1
500
re:Invent 2025 のイケてるサービスを紹介する
maroon1st
0
160
Spinner 軸ズレ現象を調べたらレンダリング深淵に飲まれた #レバテックMeetup
bengo4com
1
210
脳の「省エネモード」をデバッグする ~System 1(直感)と System 2(論理)の切り替え~
panda728
PRO
0
130
ゲームの物理 剛体編
fadis
0
390
生成AI時代を勝ち抜くエンジニア組織マネジメント
coconala_engineer
0
37k
Featured
See All Featured
How to optimise 3,500 product descriptions for ecommerce in one day using ChatGPT
katarinadahlin
PRO
0
3.4k
SEO in 2025: How to Prepare for the Future of Search
ipullrank
3
3.3k
Ethics towards AI in product and experience design
skipperchong
1
150
Color Theory Basics | Prateek | Gurzu
gurzu
0
160
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
287
14k
We Analyzed 250 Million AI Search Results: Here's What I Found
joshbly
0
380
The Curious Case for Waylosing
cassininazir
0
200
Raft: Consensus for Rubyists
vanstee
141
7.3k
How To Speak Unicorn (iThemes Webinar)
marktimemedia
1
360
Information Architects: The Missing Link in Design Systems
soysaucechin
0
730
The Language of Interfaces
destraynor
162
26k
The Pragmatic Product Professional
lauravandoore
37
7.1k
Transcript
WEBAUDIO
WebAudio != <audio … >
// create new <audio> var audioElement = new Audio();
// create new WebAudio Context var context = new audioContext();
// create new WebAudio Context var context = new webkitAudioContext();
WICKED WEBAUDIO DEMOS http://chromium.googlecode.com/svn/trunk/samples/audio/samples.html
PLAY
audioElement.src = path // check/wait until you can play audioElement.play();
var source = context.createBufferSource(); source.buffer = buffer; source.connect(context.destination); source.noteOn(at); //
PLAY
var source = context.createBufferSource(); source.buffer = buffer; source.connect(context.destination); source.noteOn(at); //
PLAY
var source = context.createBufferSource(); source.buffer = buffer; source.connect(context.destination); source.noteOn(at); //
PLAY
$.ajax({ url: "/path/to/my/sound/file", success: decodeAudioData, requestType: "arraybuffer" });
$.ajax({ url: "/path/to/my/sound/file", success: decodeAudioData, requestType: "arraybuffer" }); NOPE
var request = new XMLHttpRequest(); request.open("GET", "/path/to/sound"); request.responseType = "arraybuffer";
request.onload = decodeAudioData; request.send();
var request = new XMLHttpRequest(); request.open("GET", "/path/to/sound"); request.responseType = "arraybuffer";
request.onload = decodeAudioData; request.send();
var decodeAudioData = function() { context.decodeAudioData( request.response, decodeSuccess); };
var decodeSuccess = function(buffer) { doSomething(buffer); };
var decodeSuccess = function(buffer) { doSomething(buffer); };
var decodeSuccess = function(buffer) { doSomething(buffer); };
I MADE SOME FUNCTIONS github.com/theophani/load-sounds
var loadSound = function(path, callback) { // load the sound
sorta like I showed before };
var loadSounds = function(paths, callback) { // load a bunch
of sounds };
var playSound = function(buffer) { // stuff with source and
context };
Tiffany Conroy github.com/theophani/load-sounds @theophani