1

I'm trying to make a music player for my dj mixes(Most over an hour long), whilst also taking advantage of Web Audio Contexts analyzer node to have some audio reactive elements on my website on playback. When looking into it, I found that to do music seeking with audio context I need to buffer it.

Buffering an hour long mix takes up a lot of ram and internet bandwidth before it even starts playing, so that's not something I can do on a website. But also listening to mixes with many songs without the ability to skip around is annoying as well.

How do big websites like mixcloud or soundcloud do it?

Is there an alternative way to get both AnalyserNodes functionality and music seeking for long audio content?

I also looked into howler.js hoping it would solve something, but I can't get it to do what I need without buffering either, since its built on top of the same API.

djkato
  • 542
  • 1
  • 4
  • 12
  • Did you find an answer? Seeking to the point in a file you want to play without having to download the rest reduces waste. – Mike Bailey Jun 16 '22 at 05:12
  • @MikeBailey I never have found an answer unfortunately. I just decided that the Analyzer node is more important to me than seeking sadly and moved on. Wish there was a way but didn't find anything. Was thinking of finding a way to use both, so split up the files on server into many chunks and then dynamically serve them somehow myself while buffering only that small section and analyze that, but I'm not good enough to make that and I couldn't find a solution either. – djkato Jun 17 '22 at 11:17
  • Found it! media.currentTime = timestamp; https://davatron5000.github.io/TimeJump/ – Mike Bailey Jun 21 '22 at 11:42

1 Answers1

1

Learned from this open source project:

media = document.querySelector('audio');
media.currentTime = 3600; // set playhead 1 hour in
media.play();
Mike Bailey
  • 1,111
  • 8
  • 4