Safari's Web Audio vs Chrome's

Hi Group, 

I have a question regarding the differences between Safari vs Chrome's implementation of Web Audio. I have been working on creating interactive music in the browser using the audio API. The most recent song takes users on an intergalactic ride, putting them in control of the sonic energy of the music by manipulating the speed of the spaceship. 

The song crossfades 9 mediaElementSourceNodes as the speed changes and plays a corresponding visual of flying through space using Three.js. Definitely heavy on the CPU. Chrome seems to handle this well even though it's using up almost all of my processor(s); there are rarely any glitches in the audio and it doesn't fall out of sync almost ever (though i detect and correct this situation when it happens). 

Safari is a whole other story. The audio starts out of sync and never gets in sync. The crossfades (using the audioGainNode) don't seem to work and they don't initialize to the correct state so when it starts all of the tracks are playing (out of sync with each other, which makes for a very trippy sound, but not the sound that I'm after). 

So far i've been browser detecting to deny anyone not using Chrome. I would like to change browser-detection to feature-detection and throw a message when people don't have Web Audio, but first I need to get this Safari issue sorted out. 

Here is the site without the browser detection enabled. check it out on Chrome and then Safari to hear the difference. 

http://beta.dutchgramophone.com/rocketship/safari.html

I'm wondering if other people have noticed the big differences in the implementations, or if there are any things that i should be doing differently to make it work on both browsers? 

Any advice is greatly appreciated. 

Thanks. 

Yotam

Received on Friday, 21 September 2012 17:20:51 UTC