insights in building real-time experiences with webrtc · 3 how big is ? 800.000+ users in 72...

25
Insights in building real-time experiences with WebRTC @VictorSanchez [email protected]

Upload: others

Post on 09-Sep-2020

1 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Insights in building real-time experiences with WebRTC · 3 How big is ? 800.000+ users in 72 countries 137.000+ meeting rooms 1.250.000 shared elements in 2014

Insights in building real-time experiences with WebRTC

@[email protected]

Page 2: Insights in building real-time experiences with WebRTC · 3 How big is ? 800.000+ users in 72 countries 137.000+ meeting rooms 1.250.000 shared elements in 2014

2

What is ?

Social video-collaboration platformBased in the cloud

Integrates many toolsStartup spin-off from UPM

Page 3: Insights in building real-time experiences with WebRTC · 3 How big is ? 800.000+ users in 72 countries 137.000+ meeting rooms 1.250.000 shared elements in 2014

3

How big is ?

800.000+ users in 72 countries

137.000+ meeting rooms

1.250.000 shared elements in 2014

Page 4: Insights in building real-time experiences with WebRTC · 3 How big is ? 800.000+ users in 72 countries 137.000+ meeting rooms 1.250.000 shared elements in 2014

4

Take a look at

DEMO TIME

Page 5: Insights in building real-time experiences with WebRTC · 3 How big is ? 800.000+ users in 72 countries 137.000+ meeting rooms 1.250.000 shared elements in 2014

5

The concept for

? E [ ¿ * …

Page 6: Insights in building real-time experiences with WebRTC · 3 How big is ? 800.000+ users in 72 countries 137.000+ meeting rooms 1.250.000 shared elements in 2014

Synchronization

Page 7: Insights in building real-time experiences with WebRTC · 3 How big is ? 800.000+ users in 72 countries 137.000+ meeting rooms 1.250.000 shared elements in 2014

6

Screen sharing VS

your bad upload connection goes here

frustrating experiences are delivered here

Page 8: Insights in building real-time experiences with WebRTC · 3 How big is ? 800.000+ users in 72 countries 137.000+ meeting rooms 1.250.000 shared elements in 2014

7

Screen sharing VSB

Bupload the document to our CDN

B B B

CDN

everyone downloads the same content

Page 9: Insights in building real-time experiences with WebRTC · 3 How big is ? 800.000+ users in 72 countries 137.000+ meeting rooms 1.250.000 shared elements in 2014

8

Sync inB

BJSON.stringify(go to slide 3);

B B B

watching slide 3 in 200ms or less

WebSockets and/or WebRTC Data Channel

Page 10: Insights in building real-time experiences with WebRTC · 3 How big is ? 800.000+ users in 72 countries 137.000+ meeting rooms 1.250.000 shared elements in 2014

9

Collaboration === CollisionsB

BJSON.stringify(go to slide 3);

B B B

JSON.stringify(go to slide 4);?? ?? ??

Page 11: Insights in building real-time experiences with WebRTC · 3 How big is ? 800.000+ users in 72 countries 137.000+ meeting rooms 1.250.000 shared elements in 2014

10

Operational Transformations

Source: http://en.wikipedia.org/wiki/Operational_transformation

Page 12: Insights in building real-time experiences with WebRTC · 3 How big is ? 800.000+ users in 72 countries 137.000+ meeting rooms 1.250.000 shared elements in 2014

11

Google Wave Operational Transformations

Source: http://www.waveprotocol.org/whitepapers/operational-transform

Page 13: Insights in building real-time experiences with WebRTC · 3 How big is ? 800.000+ users in 72 countries 137.000+ meeting rooms 1.250.000 shared elements in 2014

12

Managing operations in

? Eyoutube_playyoutube_stopyoutube_jump

map_zoommap_pan

……

> 100 events

Page 14: Insights in building real-time experiences with WebRTC · 3 How big is ? 800.000+ users in 72 countries 137.000+ meeting rooms 1.250.000 shared elements in 2014

Architecture

Page 15: Insights in building real-time experiences with WebRTC · 3 How big is ? 800.000+ users in 72 countries 137.000+ meeting rooms 1.250.000 shared elements in 2014

Frontend instance

13

Architecture for

CDN

MCU

Real-time channel

browser client

Non-relational DB

Relational DB

Page 16: Insights in building real-time experiences with WebRTC · 3 How big is ? 800.000+ users in 72 countries 137.000+ meeting rooms 1.250.000 shared elements in 2014

Frontend instance

14

Architecture for

Room A

Frontend instanceRoom B

Relatively small instances to serve a few roomsRelatively small MCUs to serve a few roomsMemcache and/or REDIS to reduce DB pressure

Page 17: Insights in building real-time experiences with WebRTC · 3 How big is ? 800.000+ users in 72 countries 137.000+ meeting rooms 1.250.000 shared elements in 2014

15

Why small instances in

+ Allow to cache many DB requests (for example room content, participants, history, …)+ If a small instance or MCU fail casualties are minimal (a few rooms)

+ No need for complex configuration- difficult to monitor

+ Fast recovery and traffic spikes adaptation

- difficult to adapt for very dynamic rooms

Page 18: Insights in building real-time experiences with WebRTC · 3 How big is ? 800.000+ users in 72 countries 137.000+ meeting rooms 1.250.000 shared elements in 2014

16

How do we pays the bills at

Frontend instance

Javascript ( 95.000 lines of code)HTML5CSS3

Python ( 5000 lines of code)

This is a very complex distributed brain This is a “silly” router

$0 $something

Javascript ( 95.000 lines of code)HTML5 ( 47.000 lines of code)CSS3 (29.000 lines of code)

Page 19: Insights in building real-time experiences with WebRTC · 3 How big is ? 800.000+ users in 72 countries 137.000+ meeting rooms 1.250.000 shared elements in 2014

17

How do we pays the bills at

MCU

Real-time channel

$MONEY

- Most expensive infrastructure- Knowing your traffic helps A LOT.

Page 20: Insights in building real-time experiences with WebRTC · 3 How big is ? 800.000+ users in 72 countries 137.000+ meeting rooms 1.250.000 shared elements in 2014

What we are building now…

Page 21: Insights in building real-time experiences with WebRTC · 3 How big is ? 800.000+ users in 72 countries 137.000+ meeting rooms 1.250.000 shared elements in 2014

18

The future at

Javascript ( 95.000 lines of code)HTML5 ( 47.000 lines of code)CSS3 (29.000 lines of code)

NOW

Modules & Closures

JavascriptHTML5CSS3

THE FUTURE

WebComponents

Page 22: Insights in building real-time experiences with WebRTC · 3 How big is ? 800.000+ users in 72 countries 137.000+ meeting rooms 1.250.000 shared elements in 2014

18

The future at

NOW THE FUTURE

? ¿ [ *

Room profiles

?[ *

¿?¿

Custom rooms

Page 23: Insights in building real-time experiences with WebRTC · 3 How big is ? 800.000+ users in 72 countries 137.000+ meeting rooms 1.250.000 shared elements in 2014

18

The future at

NOW THE FUTURE

MCU

Real-time

dead by scale change MCU

Real-time

room migrationMCU groups

Page 24: Insights in building real-time experiences with WebRTC · 3 How big is ? 800.000+ users in 72 countries 137.000+ meeting rooms 1.250.000 shared elements in 2014

Questions?

Page 25: Insights in building real-time experiences with WebRTC · 3 How big is ? 800.000+ users in 72 countries 137.000+ meeting rooms 1.250.000 shared elements in 2014

Thank [email protected]

www.mashme.tv @mashmetv

facebook.com/MashMeTV Calle Cronos, 20. 28037 (Madrid)