WebTorrent: Bringing P2P to the masses with WebRTC

Talk Title: WebTorrent: Bringing P2P to the masses with WebRTC
Speaker: Feross Aboukhadijeh
Conference: SIGNAL Conference 2016

Learn more about WebTorrent at https://webtorrent.io

Transcript

1. WEB TORRENT BRINGING P2P TO THE MASSES WITH WEBRTC
2. ONCE UPON A TIME...
4. RESILIENT
6. NO MIDDLEMEN
7. DIVERSE
8. PEOPLE POWERED
9. P2P PEER TO PEER
10. P2P ADVANTAGES > Censorship resistant > Privacy preserving > User controls their data > Safe against user-hostile changes
11. P2P APPLICATIONS > Currency Bitcoin > Web Tor, I2P, Freenet > Storage IPFS, Tahoe > Computation Ethereum > File sharing BitTorrent, WebTorrent
12. APPLICATIONS THAT USE P2P > Communication Skype, Hangouts > Music Spotify > OS Windows Update > Game Updates Blizzard, EVE Online > Content Delivery Network PeerCDN
13. CENTRALIZED APPS > ALL THE REST
14. SERVER → CLIENT
15. MAINFRAME → PC → CLOUD → ?
16. PEER ® PEER
17. P2P APPLICATIONS > Currency Bitcoin > Web Tor, I2P, Freenet > Storage IPFS, Tahoe > Computation Ethereum > File sharing BitTorrent, WebTorrent
18. WEB APPS TRAPPED IN THE BROWSER
19. DOMAINS, DNS, URLS
20. WEB ≠ P2P
21. WHAT IF IT WAS?
22. The way we code the Web will determine the way we live online. So we need to bake our values into our code. — Brewster Kahle, Internet Archive
23. WEB RTC REAL TIME COMMUNICATIONS
24. DATA CHANNEL HIDDEN GEM IN WEBRTC
25. DATA CHANNEL API var channel = peer.createDataChannel() channel.send('hi') channel.addEventListener('message', function (event) { console.log('got message: ' + event.data) })
26. THE ONLY P2P TRANSPORT THAT WORKS IN THE BROWSER
27. NAT TRAVERSAL
28. NO CROSS-ORIGIN POLICY
29. TRANSPORT ENCRYPTION
30. WEBRTC DATA CHANNEL IS UNIVERSAL
31. > WebRTC in web apps (desktop & mobile) > WebRTC in desktop apps > WebRTC in mobile apps > WebRTC in server/cli apps
32. BUILD P2P APPS
33. BUILD P2P PROTOCOLS
35. TORRENT CLIENT FOR THE WEB
36. DEMO
37. var WebTorrent = require('webtorrent') var client = new WebTorrent() client.add('magnet:...', function (torrent) { var file = torrent.files[0] // Display the file by adding it to the DOM. // Supports video, audio, image files, and more! file.appendTo('body') })
38. WEBTORRENT PROTOCOL IS 95% BITTORRENT
39. BITTORRENT WIRE PROTOCOL > TCP > uTP (UDP) > WebRTC
40. BITTORRENT TRACKER PROTOCOL > HTTP > UDP > WebSocket
41. HTTP/UDP TRACKERS 1. Send message to tracker (info hash, IP address, port) 2. Receive response with list of peers 3. Tracker adds you to list of peers
42. OFFER. ANSWER.
43. WEBSOCKET TRACKERS 1. Open WebSocket connection to tracker 2. Send message (info hash, WebRTC offers) 3. Receive some WebRTC answers 4. Keep WebSocket open to receive remote offers
44. WIRE PROTOCOL IS 100% THE SAME
45. BITTORRENT TRACKER PROTOCOL > HTTP > UDP > WebSocket
46. WEBTORRENT ON NPM > Lightweight (just 75 KB) > Pure JavaScript (no native dependencies) > Full-featured (magnet uris, dht, tracker, pex) > Stream from files (On-demand piece prioritization)
47. DESKTOP APP
48. WEBTORRENT DESKTOP
51. AIRPLAY, CHROMECAST, CLOSED CAPTIONS
52. DEMO
53. ELECTRON BUILD CROSS PLATFORM DESKTOP APPS WITH JAVASCRIPT, HTML, & CSS
54. PERFECT FOR WEBTORRENT DESKTOP
55. PERFECT FOR WEBRTC APPS
56. NODE.JS + CHROME
57. ELECTRON INCLUDES WEBRTC
58. WORKS IN NODE.JS & THE BROWSER
59. TORRENT TRANSPORTS > BitTorrent TCP/UDP > WebTorrent WebRTC
60. TORRENT TRANSPORTS > Node.js → TCP/UDP > Browser → WebRTC > Electron → TCP/UDP, WebRTC
61. WEBTORRENT DESKTOP IS A HYBRID TORRENT CLIENT
62. TALKS TO TRADITIONAL TORRENT CLIENTS & BROWSER TORRENT CLIENTS
63. OS INTEGRATION
69. AUTO UPDATER
70. WEBRTC EVERYWHERE
71. LEARN MORE AT WEBTORRENT.IO
72. THANKS! SAY HI AT @FEROSS OR FEROSS.ORG