I'm working on a Next.js application where I record audio in WAV format using a MediaRecorder extension. I need to keep the audio in WAV for Azure speech services, but I want to compress it to a smaller format like MP3 or WebM before storing it in a bucket (most likely S3) for future playback. I've considered server-side processing for compression, but that feels like overengineering. I'd prefer to handle the compression on the client side. Are there any updated libraries or methods for compressing WAV files directly in the browser? I found Lamejs, but I'm unsure about its current usability. Here's how I'm currently setting up my MediaRecorder: ... (code snippet).
1 Answer
A really interesting challenge! If your audio is mostly speech, you could set your MediaRecorder's MIME type to Opus, which most browsers support. Check this MDN page to see if your target browsers support it. If that doesn't meet your needs, consider using ffmpeg.wasm for more control, but it might be heavier than what you want.
Thanks for your insight! I've shared more details in my post. I think WAV and WebM can't be used together since Azure requires the WAV format. Even though ffmpeg.wasm looks great, I've seen some complaints about its size. Do you have experience with it?