2

I want to play buffered audio in my game for long music files (sort of streaming). It seems I have to use html audio: Buffered audio in SoundJS

However, I still want to use webaudio for sound effects (to avoid delay on mobile browsers, for example).

Is this doable? Can I use html audio for some sounds and web audio for other sounds in the same page, or I'll have to manually create some html audio tags for my music files?

sbat
  • 1,453
  • 10
  • 21
  • Why do you need both? Web Audio can do anything HTML audio can do (and better). – Lanny Aug 07 '17 at 21:48
  • Lanny, I want to start Audio playback before huge music file is loaded (and don't mind if it buffers/breaks for end user). My understanding (see linked questions): unless SoundJS supports createMediaElementSource (does it?), you have to completely download the stream before the playback. Howlerjs provides html5: true flag for this use case. – sbat Aug 08 '17 at 07:34
  • Quote: > After Googling about it, I found this thread. It says that the WebAudioPlugin does not support buffering because of the underlying technology, but the HTMLAudioPlugin can play the audio before it is fully loaded. – sbat Aug 08 '17 at 07:35
  • 1
    Yep makes sense. – Lanny Aug 08 '17 at 15:11

1 Answers1

4

You actually can stream into the web audio api, it adds a fair amount of complexity though. You will have to manually append audio data fragments to the buffer you are playing as they come in and move loading and decoding into a web worker so you don't block the main thread. Because web audio isn't available in web workers you have to use a third party decoding library. I switched to Aurora in a web worker for loading and decoding audio in an app, it downloads and decodes the audio in chunks and doesn't block main thread. Also decode audio data from the web api uses up all your cpu in Firefox, up to 95% on my machine which is fairly fast. Ontop of that it allowed me to load far more audio assets without crashing the browser tab, 100+ 20mb wav files where ad on the main thread the browser tab would crash at a little over 40.

David Sherman
  • 320
  • 2
  • 9
  • This is useful info, +1ed. Not marking it as "correct" answer, as my question was specifically on mixing html audio tag and webaudio in SoundJS library (part of CreateJS). However, re your usecase: what prevents you from using createMediaStreamSource? It is reasonably well supported, I think they even have it now on latest Safari? Haven't tried it myself though. – sbat Nov 21 '17 at 10:57
  • 1
    I actually did not need streaming support, I switched for the non blocking nature, Firefox cpu usage and increase in audio assets that can be loaded. I actually need the full file as I have to draw the waveforms, there would be some way to do this progressively as it streams in but for me it was unnessicary extra complexity. I send a message to the worker from the main thread with a url to audio resource + id, worker downloads and decodes audio file and posts it back to the main thread (with transfer so audio data doesn't have to be serialized) – David Sherman Nov 22 '17 at 17:22