audio-recorder-polyfill icon indicating copy to clipboard operation
audio-recorder-polyfill copied to clipboard

Glitchy audio recordings on low end/older mobile devices

Open james3burke opened this issue 5 years ago • 4 comments
trafficstars

Hi, we've created a website that lets people record 2 minute audio clips and then upload them. It looks like on lower end mobile devices we get very choppy recordings, for example:

https://prod.roundware.com/rwmedia/20200611-144343-72862.mp3

Which I think was recorded on an android 8 device:

Mozilla/5.0 (Linux; Android 8.1.0; 6062W) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/80.0.3987.132 Mobile Safari/537.36

Our code is basically the example from your readme, but configured to create the blob as mp3. (Here's a snippet)

// Record with mp3.
MediaRecorder.encoder = mpegEncoder;
MediaRecorder.prototype.mimeType = "audio/mpeg";

startRecordButton.addEventListener("click", () => {
  console.log("Start recording!");

  // Request permissions to record audio
  navigator.mediaDevices.getUserMedia({ audio: true }).then(stream => {
    recorder = new MediaRecorder(stream);

    // Set record to <audio> when recording will be finished
    recorder.addEventListener('dataavailable', e => {
      console.log('data available: ' + e.data.size);
      saveBlob = e.data;
    })

    // Start recording
    recorder.start();
  })

Is there any way to improve the quality of recordings on these lower end devices? The glitching seems to happen even for short audio recordings, so it doesn't seem like it's the size of the blob that causes it.

Thanks.

james3burke avatar Jun 12 '20 13:06 james3burke

Sorry, I have no idea how to fix it.

If you will find a solution, PR is welcome.

ai avatar Jun 12 '20 13:06 ai

Hi, I am experiencing this issue too, very similar result to @james3burke.

It doesn't happen on all devices but more consistently on a Lenovo laptop + Windows 10 + Chrome 83.0.4103.106

We are using default wav encoding. It is also mainly short recordings, 2-10 seconds one after the other. On other parts of the Web App we are doing longer recordings, and there it doesn't seem to be an issue.

@james3burke have you found any hints on what might be causing it? Do you have a similar setup with several short recordings, one after the other?

Thank you!

tamarabernad avatar Jun 23 '20 14:06 tamarabernad

@tamarinda No sorry - we think our problem is caused by a lack of system resources on older phones, but it doesn't seem related to the length of the recording. It's mostly been okay on laptops as far as we can tell.

james3burke avatar Jul 02 '20 08:07 james3burke

@james3burke Have you figured this out in the proceeding months? I have this issue currently with or without this polyfill. Identical results to shared sample MP3, on Chrome.

alectrocute avatar Nov 18 '20 12:11 alectrocute