Echo in WebRTC; Why?

Muaz Khan
Muaz KhanWebRTC Developer at WebRTC
Muaz Khan

Echo is a distortion of voice that occurs either
when you receive your own voice; or something
unusual sound!
Echo is one of the biggest issues in current WebRTC
implementations!
Echo occurs if input output audio devices are placed
close together!

In old days; usage of the “headsets” was the only
“suggested” solution to overcome the echo!
Sometimes,
44.1 kHz and non-441.1 kHz simple rate mismatches
causes echo!
The "ambient noise reduction" which can be enabled
on the built-in mic on Mac appears to cause a very
small amount of echo.
Ensure both capture and render devices are set to
either 44.1 or 48 kHz. You can do this through the
"Audio MIDI Setup" application
Disable "ambient noise reduction“ on Mac.
Make sure there is distance between input and output
audio devices.
(Old guys suggested that) always prefer headphones
over built-in speakers!
Suggest users to install third party software(s) to mimic
echo.
E.g. Toshiba Echo Cancellation Utility
etc.

Acoustic Echo Cancellation (AEC) is a preferred solution!
High volume can produce sound noise on some audio
devices. The value may not be significant if audio
device volume is controlled externally.

HTMLAudioElement.volume = 0.9;
HTMLAudioElement.play();
Acoustic Echo is what happens when sound from your
speakers enters your microphone.
You may not hear it, but the people you are talking to will find it extremely irritating
Don’t use “autoplay:true” for local streams.
Manually set “muted:false” and “volume:0”:
HTMLVideoElement.volume = 0;
HTMLVideoElement.muted = 0;
The GainNode is a simple element that lets us control
the volume of the audio that’s coming into it.
var context = new webkitAudioContext(),
var sineWave = context.createOscillator();
var gainNode = context.createGainNode();
sineWave.connect(gainNode);
gainNode.connect(context.destination);
sineWave.noteOn(0);
gainNode.gain.value = 0.9;

Try this demo locally to control volume using GainNode.
No concrete solution!
Browser vendors landed some patches; however, still
echo issues occur on Firefox, Chrome and Opera!
Patches (getUserMedia constraints API):
googEchoCancellation
googAutoGainControl
googNoiseSuppression
googHighpassFilter

googNoiseReduction
googLeakyBucket

Ref: mediaconstraintsinterface.h
Acoustic Echo Cancellation (AEC) solves echo/noise
issues by analyzing the sound being played out from
your speakers and removes it from the sound captured
by your microphone.

Current AEC implementation in chromium uses less
CPU and improves voice quality.
Echo Controller works with 8k/16k sampling rate
however there are special processes in chromium to
make Echo Controller work for iSAC codec i.e. 32k
sampling audio; and opus codec i.e. 48k.
AEC may not work for mobile platforms with complex
implementations; only AECM could work which has
performance issues.
AECM provides poor quality; causes very loud background noise.
However, unfortunately, it seems that 40% of android devices are
unable to handle AEC.
AECM is unable to handle double talk.
AEC may fail to handle distorted input due to linear
algorithms.
AECM is limited to 8k/16k sampling rate; so skip opus
usage on android devices until AEC gets improved in
chromium!
Should mobile users compromise?
Hmm, unfortunately!
It is said that echo occurs when sound from the
speakers is picked up by the audio input devices i.e.
microphones. You need to place both devices away
from each other.
 People usually suggest to mute participants' audio
while they're idle. Remember, voice-activitydetection is "already" enabled by default on chrome.
RTP packets are streamed accordingly. So, there are
less chances of echo in such scenario.
 You either need to install echo cancellation software
according to your platform and devices; or try to use
microphone/headphone.







WebRTC Eco Cancellation
WebRTC improvement optimized aecacoustic echo
cancellation
mediaconstraintsinterface.h
https://github.com/muaz-khan/WebRTCExperiment/issues/95#issuecomment-24562690
https://code.google.com/p/webrtc/issues/detail?id=
2580
Muaz Khan
www.WebRTC-Experiment.com

muazkh@gmail.com
1 of 19

Recommended

Mieszko Zielinski (Epic Games), White Nights 2015 by
Mieszko Zielinski  (Epic Games), White Nights 2015 Mieszko Zielinski  (Epic Games), White Nights 2015
Mieszko Zielinski (Epic Games), White Nights 2015 White Nights Conference
2K views20 slides
良くわかるMeta by
良くわかるMeta良くわかるMeta
良くわかるMetadaichi horio
34.4K views32 slides
ゲーム開発を乗りこなせ! ヒストリア流ゲーム開発マネジメント手法 by
ゲーム開発を乗りこなせ! ヒストリア流ゲーム開発マネジメント手法ゲーム開発を乗りこなせ! ヒストリア流ゲーム開発マネジメント手法
ゲーム開発を乗りこなせ! ヒストリア流ゲーム開発マネジメント手法historia_Inc
1.6K views45 slides
【Unite Tokyo 2018】その最適化、本当に最適ですか!? ~正しい最適化を行うためのテクニック~ by
【Unite Tokyo 2018】その最適化、本当に最適ですか!? ~正しい最適化を行うためのテクニック~【Unite Tokyo 2018】その最適化、本当に最適ですか!? ~正しい最適化を行うためのテクニック~
【Unite Tokyo 2018】その最適化、本当に最適ですか!? ~正しい最適化を行うためのテクニック~Unity Technologies Japan K.K.
12K views51 slides
Lenses - Real-time Rendering of Physically Based Optical Effect in Theory an... by
Lenses - Real-time Rendering of Physically Based Optical Effect in Theory an...Lenses - Real-time Rendering of Physically Based Optical Effect in Theory an...
Lenses - Real-time Rendering of Physically Based Optical Effect in Theory an...Silicon Studio Corporation
39.8K views57 slides
【Unite Tokyo 2018】さては非同期だなオメー!async/await完全に理解しよう by
【Unite Tokyo 2018】さては非同期だなオメー!async/await完全に理解しよう【Unite Tokyo 2018】さては非同期だなオメー!async/await完全に理解しよう
【Unite Tokyo 2018】さては非同期だなオメー!async/await完全に理解しようUnity Technologies Japan K.K.
47.8K views68 slides

More Related Content

What's hot

UE4のライティング解体新書 ~効果的なNPRのためにライティングの仕組みを理解しよう~ by
UE4のライティング解体新書 ~効果的なNPRのためにライティングの仕組みを理解しよう~UE4のライティング解体新書 ~効果的なNPRのためにライティングの仕組みを理解しよう~
UE4のライティング解体新書 ~効果的なNPRのためにライティングの仕組みを理解しよう~Tatsuhiro Tanaka
4.9K views144 slides
PHPで並列処理する ライブラリを作った by
PHPで並列処理する ライブラリを作ったPHPで並列処理する ライブラリを作った
PHPで並列処理する ライブラリを作ったHironobu Saitoh
9.2K views24 slides
GoによるWebアプリ開発のキホン by
GoによるWebアプリ開発のキホンGoによるWebアプリ開発のキホン
GoによるWebアプリ開発のキホンAkihiko Horiuchi
61K views33 slides
UniRx完全に理解した by
UniRx完全に理解したUniRx完全に理解した
UniRx完全に理解したtorisoup
9.3K views36 slides
【Unite 2018 Tokyo】Unityにおける疎結合設計 ~UIへの適用事例から学ぶ、テクニックとメリット~ by
【Unite 2018 Tokyo】Unityにおける疎結合設計 ~UIへの適用事例から学ぶ、テクニックとメリット~【Unite 2018 Tokyo】Unityにおける疎結合設計 ~UIへの適用事例から学ぶ、テクニックとメリット~
【Unite 2018 Tokyo】Unityにおける疎結合設計 ~UIへの適用事例から学ぶ、テクニックとメリット~UnityTechnologiesJapan002
13.2K views58 slides
【Unity道場 3月 ~ライティングとVFX Graph~】Unityのライティング機能のおさらい by
【Unity道場 3月 ~ライティングとVFX Graph~】Unityのライティング機能のおさらい【Unity道場 3月 ~ライティングとVFX Graph~】Unityのライティング機能のおさらい
【Unity道場 3月 ~ライティングとVFX Graph~】Unityのライティング機能のおさらいUnity Technologies Japan K.K.
8.5K views66 slides

What's hot(20)

UE4のライティング解体新書 ~効果的なNPRのためにライティングの仕組みを理解しよう~ by Tatsuhiro Tanaka
UE4のライティング解体新書 ~効果的なNPRのためにライティングの仕組みを理解しよう~UE4のライティング解体新書 ~効果的なNPRのためにライティングの仕組みを理解しよう~
UE4のライティング解体新書 ~効果的なNPRのためにライティングの仕組みを理解しよう~
Tatsuhiro Tanaka4.9K views
PHPで並列処理する ライブラリを作った by Hironobu Saitoh
PHPで並列処理する ライブラリを作ったPHPで並列処理する ライブラリを作った
PHPで並列処理する ライブラリを作った
Hironobu Saitoh9.2K views
GoによるWebアプリ開発のキホン by Akihiko Horiuchi
GoによるWebアプリ開発のキホンGoによるWebアプリ開発のキホン
GoによるWebアプリ開発のキホン
Akihiko Horiuchi61K views
UniRx完全に理解した by torisoup
UniRx完全に理解したUniRx完全に理解した
UniRx完全に理解した
torisoup9.3K views
【Unite 2018 Tokyo】Unityにおける疎結合設計 ~UIへの適用事例から学ぶ、テクニックとメリット~ by UnityTechnologiesJapan002
【Unite 2018 Tokyo】Unityにおける疎結合設計 ~UIへの適用事例から学ぶ、テクニックとメリット~【Unite 2018 Tokyo】Unityにおける疎結合設計 ~UIへの適用事例から学ぶ、テクニックとメリット~
【Unite 2018 Tokyo】Unityにおける疎結合設計 ~UIへの適用事例から学ぶ、テクニックとメリット~
【Unity道場 3月 ~ライティングとVFX Graph~】Unityのライティング機能のおさらい by Unity Technologies Japan K.K.
【Unity道場 3月 ~ライティングとVFX Graph~】Unityのライティング機能のおさらい【Unity道場 3月 ~ライティングとVFX Graph~】Unityのライティング機能のおさらい
【Unity道場 3月 ~ライティングとVFX Graph~】Unityのライティング機能のおさらい
【Unity道場 2017】パーティクルエフェクト実践編 ~ヒットエフェクト制作プレイクダウン~ by Unity Technologies Japan K.K.
【Unity道場 2017】パーティクルエフェクト実践編 ~ヒットエフェクト制作プレイクダウン~【Unity道場 2017】パーティクルエフェクト実践編 ~ヒットエフェクト制作プレイクダウン~
【Unity道場 2017】パーティクルエフェクト実践編 ~ヒットエフェクト制作プレイクダウン~
基礎から学ぶ組み込みAndroid by demuyan
基礎から学ぶ組み込みAndroid基礎から学ぶ組み込みAndroid
基礎から学ぶ組み込みAndroid
demuyan8.5K views
Photon Fusionのはじめの一歩 by 聡 大久保
Photon Fusionのはじめの一歩Photon Fusionのはじめの一歩
Photon Fusionのはじめの一歩
聡 大久保942 views
アプリ屋もDockerをドカドカ使おう ~ Docker入門 by Hori Tasuku
アプリ屋もDockerをドカドカ使おう ~ Docker入門アプリ屋もDockerをドカドカ使おう ~ Docker入門
アプリ屋もDockerをドカドカ使おう ~ Docker入門
Hori Tasuku14.3K views
【CEDEC2018】一歩先のUnityでのパフォーマンス/メモリ計測、デバッグ術 by Unity Technologies Japan K.K.
【CEDEC2018】一歩先のUnityでのパフォーマンス/メモリ計測、デバッグ術【CEDEC2018】一歩先のUnityでのパフォーマンス/メモリ計測、デバッグ術
【CEDEC2018】一歩先のUnityでのパフォーマンス/メモリ計測、デバッグ術
「宴」実装時に得られたUnityプログラムノウハウ by Ryohei Tokimura
「宴」実装時に得られたUnityプログラムノウハウ「宴」実装時に得られたUnityプログラムノウハウ
「宴」実装時に得られたUnityプログラムノウハウ
Ryohei Tokimura64.2K views
Blender で作ったアニメーションを Unreal Engine 4 で利用する by rarihoma
Blender で作ったアニメーションを Unreal Engine 4 で利用するBlender で作ったアニメーションを Unreal Engine 4 で利用する
Blender で作ったアニメーションを Unreal Engine 4 で利用する
rarihoma16.1K views
Unityでオンラインゲーム作った話 by torisoup
Unityでオンラインゲーム作った話Unityでオンラインゲーム作った話
Unityでオンラインゲーム作った話
torisoup10.2K views

Similar to Echo in WebRTC; Why?

Building your digital podcast workstation by
Building your digital podcast workstationBuilding your digital podcast workstation
Building your digital podcast workstationYogi's Podcast Network
255 views30 slides
[COSCUP 2013] Audio Competing by
[COSCUP 2013] Audio Competing[COSCUP 2013] Audio Competing
[COSCUP 2013] Audio CompetingAlive Kuo
615 views49 slides
Presentation rme babyface - eng by
Presentation rme babyface - engPresentation rme babyface - eng
Presentation rme babyface - engLOISEAU
1.1K views32 slides
Videoconference introduction by
Videoconference introductionVideoconference introduction
Videoconference introductionK.U.Leuven AVNet
1.3K views33 slides
Audio noise reduction techniques by
Audio  noise  reduction  techniquesAudio  noise  reduction  techniques
Audio noise reduction techniquesMeenakshi Singhvi
4.9K views57 slides
Chap67 by
Chap67Chap67
Chap67dkd_woohoo
258 views12 slides

Similar to Echo in WebRTC; Why?(20)

[COSCUP 2013] Audio Competing by Alive Kuo
[COSCUP 2013] Audio Competing[COSCUP 2013] Audio Competing
[COSCUP 2013] Audio Competing
Alive Kuo615 views
Presentation rme babyface - eng by LOISEAU
Presentation rme babyface - engPresentation rme babyface - eng
Presentation rme babyface - eng
LOISEAU1.1K views
Interactive Voice Con by Dru Wynings
Interactive Voice ConInteractive Voice Con
Interactive Voice Con
Dru Wynings1.3K views
Sound recording glossary by davidhall1415
Sound recording glossarySound recording glossary
Sound recording glossary
davidhall1415167 views
Sound recording glossary by davidhall1415
Sound recording glossarySound recording glossary
Sound recording glossary
davidhall1415367 views
Sound recording glossary improved by davidhall1415
Sound recording glossary improvedSound recording glossary improved
Sound recording glossary improved
davidhall1415142 views
Sound recording glossary improved version11111111111 by Kieran Owens
Sound recording glossary improved version11111111111 Sound recording glossary improved version11111111111
Sound recording glossary improved version11111111111
Kieran Owens215 views
Digital vs analogue recording processes by m_xch
Digital vs analogue recording processesDigital vs analogue recording processes
Digital vs analogue recording processes
m_xch307 views
Hands-Free NVH Analysis by siavoshani
Hands-Free NVH AnalysisHands-Free NVH Analysis
Hands-Free NVH Analysis
siavoshani784 views
Producing Quality How-To Videos for Social Media Publication by Bonni Graham Gonzalez
Producing Quality How-To Videos for Social Media PublicationProducing Quality How-To Videos for Social Media Publication
Producing Quality How-To Videos for Social Media Publication
Ben ce sound recording glossary by BenCom1
Ben ce sound recording glossaryBen ce sound recording glossary
Ben ce sound recording glossary
BenCom1254 views

Recently uploaded

Vertical User Stories by
Vertical User StoriesVertical User Stories
Vertical User StoriesMoisés Armani Ramírez
14 views16 slides
Mini-Track: Challenges to Network Automation Adoption by
Mini-Track: Challenges to Network Automation AdoptionMini-Track: Challenges to Network Automation Adoption
Mini-Track: Challenges to Network Automation AdoptionNetwork Automation Forum
13 views27 slides
20231123_Camunda Meetup Vienna.pdf by
20231123_Camunda Meetup Vienna.pdf20231123_Camunda Meetup Vienna.pdf
20231123_Camunda Meetup Vienna.pdfPhactum Softwareentwicklung GmbH
41 views73 slides
PRODUCT LISTING.pptx by
PRODUCT LISTING.pptxPRODUCT LISTING.pptx
PRODUCT LISTING.pptxangelicacueva6
14 views1 slide
HTTP headers that make your website go faster - devs.gent November 2023 by
HTTP headers that make your website go faster - devs.gent November 2023HTTP headers that make your website go faster - devs.gent November 2023
HTTP headers that make your website go faster - devs.gent November 2023Thijs Feryn
22 views151 slides
iSAQB Software Architecture Gathering 2023: How Process Orchestration Increas... by
iSAQB Software Architecture Gathering 2023: How Process Orchestration Increas...iSAQB Software Architecture Gathering 2023: How Process Orchestration Increas...
iSAQB Software Architecture Gathering 2023: How Process Orchestration Increas...Bernd Ruecker
40 views69 slides

Recently uploaded(20)

HTTP headers that make your website go faster - devs.gent November 2023 by Thijs Feryn
HTTP headers that make your website go faster - devs.gent November 2023HTTP headers that make your website go faster - devs.gent November 2023
HTTP headers that make your website go faster - devs.gent November 2023
Thijs Feryn22 views
iSAQB Software Architecture Gathering 2023: How Process Orchestration Increas... by Bernd Ruecker
iSAQB Software Architecture Gathering 2023: How Process Orchestration Increas...iSAQB Software Architecture Gathering 2023: How Process Orchestration Increas...
iSAQB Software Architecture Gathering 2023: How Process Orchestration Increas...
Bernd Ruecker40 views
Voice Logger - Telephony Integration Solution at Aegis by Nirmal Sharma
Voice Logger - Telephony Integration Solution at AegisVoice Logger - Telephony Integration Solution at Aegis
Voice Logger - Telephony Integration Solution at Aegis
Nirmal Sharma39 views
Future of AR - Facebook Presentation by ssuserb54b561
Future of AR - Facebook PresentationFuture of AR - Facebook Presentation
Future of AR - Facebook Presentation
ssuserb54b56115 views
GDG Cloud Southlake 28 Brad Taylor and Shawn Augenstein Old Problems in the N... by James Anderson
GDG Cloud Southlake 28 Brad Taylor and Shawn Augenstein Old Problems in the N...GDG Cloud Southlake 28 Brad Taylor and Shawn Augenstein Old Problems in the N...
GDG Cloud Southlake 28 Brad Taylor and Shawn Augenstein Old Problems in the N...
James Anderson92 views
Unit 1_Lecture 2_Physical Design of IoT.pdf by StephenTec
Unit 1_Lecture 2_Physical Design of IoT.pdfUnit 1_Lecture 2_Physical Design of IoT.pdf
Unit 1_Lecture 2_Physical Design of IoT.pdf
StephenTec12 views
STKI Israeli Market Study 2023 corrected forecast 2023_24 v3.pdf by Dr. Jimmy Schwarzkopf
STKI Israeli Market Study 2023   corrected forecast 2023_24 v3.pdfSTKI Israeli Market Study 2023   corrected forecast 2023_24 v3.pdf
STKI Israeli Market Study 2023 corrected forecast 2023_24 v3.pdf
6g - REPORT.pdf by Liveplex
6g - REPORT.pdf6g - REPORT.pdf
6g - REPORT.pdf
Liveplex10 views

Echo in WebRTC; Why?

  • 1. Muaz Khan Echo is a distortion of voice that occurs either when you receive your own voice; or something unusual sound! Echo is one of the biggest issues in current WebRTC implementations!
  • 2. Echo occurs if input output audio devices are placed close together! In old days; usage of the “headsets” was the only “suggested” solution to overcome the echo!
  • 3. Sometimes, 44.1 kHz and non-441.1 kHz simple rate mismatches causes echo!
  • 4. The "ambient noise reduction" which can be enabled on the built-in mic on Mac appears to cause a very small amount of echo.
  • 5. Ensure both capture and render devices are set to either 44.1 or 48 kHz. You can do this through the "Audio MIDI Setup" application
  • 6. Disable "ambient noise reduction“ on Mac.
  • 7. Make sure there is distance between input and output audio devices. (Old guys suggested that) always prefer headphones over built-in speakers!
  • 8. Suggest users to install third party software(s) to mimic echo. E.g. Toshiba Echo Cancellation Utility etc. Acoustic Echo Cancellation (AEC) is a preferred solution!
  • 9. High volume can produce sound noise on some audio devices. The value may not be significant if audio device volume is controlled externally. HTMLAudioElement.volume = 0.9; HTMLAudioElement.play(); Acoustic Echo is what happens when sound from your speakers enters your microphone. You may not hear it, but the people you are talking to will find it extremely irritating
  • 10. Don’t use “autoplay:true” for local streams. Manually set “muted:false” and “volume:0”: HTMLVideoElement.volume = 0; HTMLVideoElement.muted = 0;
  • 11. The GainNode is a simple element that lets us control the volume of the audio that’s coming into it. var context = new webkitAudioContext(), var sineWave = context.createOscillator(); var gainNode = context.createGainNode(); sineWave.connect(gainNode); gainNode.connect(context.destination); sineWave.noteOn(0); gainNode.gain.value = 0.9; Try this demo locally to control volume using GainNode.
  • 12. No concrete solution! Browser vendors landed some patches; however, still echo issues occur on Firefox, Chrome and Opera!
  • 13. Patches (getUserMedia constraints API): googEchoCancellation googAutoGainControl googNoiseSuppression googHighpassFilter googNoiseReduction googLeakyBucket Ref: mediaconstraintsinterface.h
  • 14. Acoustic Echo Cancellation (AEC) solves echo/noise issues by analyzing the sound being played out from your speakers and removes it from the sound captured by your microphone. Current AEC implementation in chromium uses less CPU and improves voice quality.
  • 15. Echo Controller works with 8k/16k sampling rate however there are special processes in chromium to make Echo Controller work for iSAC codec i.e. 32k sampling audio; and opus codec i.e. 48k. AEC may not work for mobile platforms with complex implementations; only AECM could work which has performance issues. AECM provides poor quality; causes very loud background noise. However, unfortunately, it seems that 40% of android devices are unable to handle AEC.
  • 16. AECM is unable to handle double talk. AEC may fail to handle distorted input due to linear algorithms. AECM is limited to 8k/16k sampling rate; so skip opus usage on android devices until AEC gets improved in chromium! Should mobile users compromise? Hmm, unfortunately!
  • 17. It is said that echo occurs when sound from the speakers is picked up by the audio input devices i.e. microphones. You need to place both devices away from each other.  People usually suggest to mute participants' audio while they're idle. Remember, voice-activitydetection is "already" enabled by default on chrome. RTP packets are streamed accordingly. So, there are less chances of echo in such scenario.  You either need to install echo cancellation software according to your platform and devices; or try to use microphone/headphone. 
  • 18.      WebRTC Eco Cancellation WebRTC improvement optimized aecacoustic echo cancellation mediaconstraintsinterface.h https://github.com/muaz-khan/WebRTCExperiment/issues/95#issuecomment-24562690 https://code.google.com/p/webrtc/issues/detail?id= 2580