Каков хороший набор ограничений для воспроизведения/мониторинга звука с минимальной задержкой с помощью API записи MediaStream?

В настоящее время я запускаю музыкальное приложение с помощью HTML5/JS и пытаюсь добиться минимальной задержки с помощью API записи MediaStream. Приложение позволяет пользователю записывать музыку с помощью камеры и микрофона. Пока камера и микрофон включены, код позволит пользователю слышать и видеть себя.

На данный момент у меня есть:

  const stream = await navigator.mediaDevices.getUserMedia(
    {
      video: true,
      audio: {
        latency: {exact: 0.003},
      }
    }
  );

  // monitor video and audio (i.e. show it to the user)
  this.video.srcObject = stream;
  this.video.play();

Если я уменьшу требование к задержке, я получу ошибку OverConstrained. Задержка в порядке (лучше, чем по умолчанию), но все же не подходит для того, чтобы слышать себя во время записи. Есть небольшое заметное отставание от того, когда вы играете на гитаре и слышите ее в наушниках.

Есть ли другие оптимизации, которые я могу сделать для достижения лучших результатов? Я не забочусь о качестве видео и звука, поэтому, возможно, здесь может помочь снижение разрешения, частоты дискретизации и т. д.?


javascript html mediastream media
person Tomek    schedule 20.08.2019    source источник
comment
В дополнение к задержке обработки через JavaScript также важно учитывать время, необходимое для оцифровки входящего звука с микрофона и физического перемещения этих данных. Никогда не будет нулевой задержки, особенно если вы используете WASAPI вместо чего-то вроде ASIO (это не то, что вы можете контролировать из браузера).   -  person IronFlare    schedule 03.09.2019

Ответы (1)


arrow_upward
3
arrow_downward

задержка 0,003 — это очень, очень низкая задержка (3 мс), незаметная для человеческого уха.

Сказал, что задержка не может быть равна 0, когда мы говорим о цифровом звуке. Несмотря на то, что вы установили очень низкое значение, не гарантируется, что задержка действительно соответствует по разным причинам, в случае, если система не может соответствовать задержке, обещание будет отклонено.

Как вы можете прочитать здесь в документах:

Ограничения, которые задаются с использованием любого или всех значений max, min или точно, всегда рассматриваются как обязательные. Если какое-либо ограничение, которое использует одно или несколько из них, не может быть выполнено при вызове applyConstraints(), обещание будет отклонено.

Примечание: разные браузеры и разные ОС ведут себя по-разному.

Хром

Chrome в некоторых канареечных сборках представила функцию с малой задержкой под названием Ввод живого веб-аудио:

// success callback when requesting audio input stream
function gotStream(stream) {
    window.AudioContext = window.AudioContext || window.webkitAudioContext;
    var audioContext = new AudioContext();

    // Create an AudioNode from the stream.
    var mediaStreamSource = audioContext.createMediaStreamSource( stream );

    // Connect it to the destination to hear yourself (or any other node for processing!)
    mediaStreamSource.connect( audioContext.destination );
}

navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia;
navigator.getUserMedia( {audio:true}, gotStream );

Здесь вы можете увидеть в действии некоторые демонстрации, использующие эту функцию:

person Mosè Raguzzini    schedule 30.08.2019
comment
Да, может быть, это ограничение времени, необходимого для обработки данных и их вывода пользователю. В этом примере mdn. mozillademos.org/en-US/docs/Web/API/Media_Streams_API/, хотя задержка действительно низкая (не должна восприниматься человеческим ухом), вы можете хлопать и слышать, что задержка там не т в 3 мс - person Tomek; 03.09.2019
comment
Интересно, можно ли здесь использовать API записи медиапотока только для видео и использовать вход Live Web Audio API веб-аудио для воспроизведения звука пользователю в целях мониторинга ввода. - person Tomek; 03.09.2019