CODEWITHSUNDEEP
javascriptcompressionaudio-streamingadaptive-bitrate
Henok
Henok

Reputation: 3393

Changing bitrate of audio file before uploading using Javascript

Implementing file uploads with different bitrates, compressing them into different qualities and then uploading. Is there a way this could be achieved using javascript ? (Audio file format is mp3)

Upvotes: -1

Views: 2139

Answers (2)

Brad
Brad

Reputation: 163448

Firstly, I recommend not bothering with MP3 at all. Opus and AAC will give you better sound quality for a given bitrate, and are well-supported.

Next, you should start with a lossless source to begin with, if at all possible. By using lossy compression on something that was already lossy-compressed, you're losing even more quality while wasting even more bandwidth by emphasizing compression artifacts.

Now, on to your question. The only optimized way to do this in-browser is to use the Media Recorder API. Basically, you can create a few instances of Media Recorder for the bitrates you want to target. Then, playback audio through a Media Stream, and stream the outputs of the Media Recorders up to your server. Ideally, this could happen faster than realtime through an Offline Audio Context. However, this isn't working in browsers at the moment so you will have to do it in realtime.

Unless you have a very strange edge use case, I wouldn't bother with this. Transcode on the server side, for a much more efficient and predictable outcome. Perhaps in the near future, we'll have a better codec API on the browser.

Upvotes: 1

kshetline
kshetline

Reputation: 13700

There's nothing built into JavaScript to do things like MP3 encoding, but there is a library for that here: https://github.com/Kagami/ffmpeg.js/

I also found an article about using that library, albeit for a somewhat different task than you have in mind, here: https://medium.com/jeremy-gottfrieds-tech-blog/javascript-tutorial-record-audio-and-encode-it-to-mp3-2eedcd466e78

I don't think there's any simple, straight-forward way to accomplish what you have in mind, unfortunately. You'll have to plod through this API and figure out how to use it to accomplish your goal.

Upvotes: 3

Related Questions