This document discusses best practices for deploying WebRTC to replace or augment existing SIP-based phone systems. It covers choosing appropriate codecs to balance bandwidth usage and call quality for different use cases. It also addresses WebRTC-specific considerations like ICE, DTLS, and asymmetric call patterns. Performance metrics are provided from test calls using different codecs on an Asterisk server. The presentation includes diagrams of common WebRTC deployment architectures and links to live demos.

1. Getting the Best out
of WebRTC
Tim Panton - Protocol Droid - Westhawk Ltd
Dan Jenkins - Chief Ape - nimblea.pe & Respoke

2. Simple 1 for 1 replacement ?
No!
Bandwidth / CPU use are different

3. How to plan a deployment
A talk in two parts

4. Architecture and Choices

5. Practical numbers and graphs

6. Assumptions
If you are here you are probably
Doing this commercially - Quality matters
Using Asterisk - Hybrid model with some PSTN
Have Asymmetric calls - agents and users
Are on a tight bandwidth and CPU budget
Video not top priority (yet)
Have a clue

7. WebRTC Topologies

8. Video Peer Calls
Video
User Agent
Internet
SIP
Audio
HTML
Context
Asterisk Webservice

9. Internal Audio Agents
Asterisk
L
A
N
App
Server
User
P
S
T
N
Agent
Agent
Agent
Agent
Agent

10. External Audio Agents
I
N
T
E
R
N
E
T
User
P
S
T
N
Agent
Agent
Agent
Agent
Agent
WebRTC
App
Server
Asterisk

11. External Audio Users
L
A
N
User
I
N
T
E
R
N
E
T
Agent
Agent
Agent
Agent
Agent
DeskPhones
HTML
WebRTC Audio
App
Server
Asterisk
SIP Phones

12. Hybrid
L
A
N
User
I
N
T
E
R
N
E
T
Agent
Agent
Agent
Agent
Agent
DeskPhones
WebRTC
Audio
HTML
App
Server
Asterisk
Agent
WebRTC
SIP Phones
PSTN
Audio FAX SMS
User
Skype
Twitter
Chat
Email
Facebook

13. WebRTC issues
How webRTC differs from plain old SIP
ICE - can penetrate NAT at cost of setup time
DTLS - encrypted traffic but call setup costs CPU
Web service - may expose your Asterisk
SRTP - encrypted media costs some CPU too.

14. Codecs
Codecs implemented in browsers today:
ULAW - old favourite - high bandwidth/ low cpu
2 quality modes - landline or incomprehensible
Opus - new comer - low bandwidth / high cpu
flexible quality and error correction settings
VP8 - free video codec - High but variable bandwidth
H264 - licensed video codec - free if < 100k (IANAL)

15. Codecs - ideal choices
(audio only)
Codec Setting Reasoning
P2P
video Opus None The browser knows best
Int
Agents ulaw None low loss on LAN +
will end up on PSTN
Ext
Agent Opus High BW / low loss Can set minimum DSL
standards for staff
Ext
User Opus Low BW / high loss Users share DSL with
web/games etc
Note - Digium does not support opus on Asterisk

16. DTLS - crypto selection

17. WebRTC uses DTLS to generate SRTP key
Different Cypher suites
Different key lengths
Multiple certificate sources
All impacts CPU usage at call setup.

18. ICE - Tricks

19. Assume your asterisk has a public IP
Probably don’t need a TURN server
Avoid offering candidates for internal IPs
Don’t offer VPN candidates
Can probably get away with setting ice-lite

20. Architecture - Asymmetry

21. In future we expect more asymmetric cases
Mayday - they see your screen not you
Baby monitor - 1 way video but 2 way audio ?
Security cameras

22. What does that all mean in practice
Probably:
Higher CPU use (especially with Opus)
Longer call setup times
Very high bandwidth with Video (if enabled)

23. Tools to monitor
Probably:
WebRTC stats (Respoke Stats)
www.npmjs.org/package/getstats
chrome://webrtc-internals
CollectD / Graphite

24. Some Numbers
Test scenario:
Asterisk: 11.8.1
on machine: Centos Intel(R) Core(TM) i3-4010U CPU @ 1.70GHz
Chrome 38
Ramp up 24 calls
Play back intermittent audio (IVR usage)
Graph - bandwidth / CPU / calls / time

25. 24 ulaw audio calls
Graph

26. 24 opus audio calls - No settings
Graph

27. 24 opus audio calls
Low BW high loss
Graph

28. Some MORE “Numbers”
Test scenario:
Digital Ocean
Medium Droplet
San Francisco

29. 1 P2P video call - LAN/WAN
http://bit.ly/dt-demo

30. 1 P2P video call - WAN
http://bit.ly/dt-demo

31. Live demo using respoke
Chrome (android too) browse here!
URL:
http://bit.ly/dt-asterisk

32. Thank you!
Questions?
More info at:
github.com/danjenkins/web-examples
@dan_jenkins
@steely_glint
www.respoke.io

33. Images Used
http://upload.wikimedia.org/wikipedia/commons/c/ca/Padlock_2010.JPG
http://upload.wikimedia.org/wikipedia/commons/8/8e/
Ice_road_in_the_Northwest_Territories_-a.jpg
http://upload.wikimedia.org/wikipedia/commons/4/41/Asymmetric_%28PSF
%29.png