Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Web Apps of the Future

Web Apps of the Future

Web Apps of the Future

The ideal app is peer-to-peer, offline, and decentralized. Apps should protect users from censorship, the addition of user-hostile features, and data loss due to business failure. Good news! The future is here early; it's possible to build a service like this today, using WebRTC, Service Workers, Web Crypto, and replicating databases. Welcome to the future!

B498d33041627b07726dc29c28f02df7?s=128

Feross Aboukhadijeh

September 03, 2015
Tweet

Transcript

  1. Web Apps of the Future presented by Feross

  2. Web vs. Native

  3. Open vs. Closed

  4. Good vs. Evil

  5. The Web's Advantages 4 Better 4 More fun 4 More

    open
  6. The Web is Better 4 Links 4 No install needed

    4 Instant updates
  7. The Web is More Fun 4 Easier to learn 4

    Easier to build mashups 4 HTML, CSS, & JavaScript are fun!
  8. The Web is More Open 4 Open standards 4 Not

    controlled by a single company
  9. Native apps 4 Offline 4 Discoverable 4 Push notifications 4

    Performance
  10. Does any of this matter to users?

  11. None
  12. None
  13. A more important question... How do you build your app?

  14. Centralized vs. De-centralized

  15. Open vs. Closed

  16. Good vs. Evil

  17. Centralized Apps 4 Simple & fast to build 4 Easy

    to make money 4 Easy to get VC funding
  18. De-centralized Apps 4 Censorship resistant 4 Privacy preserving 4 User

    controls their data 4 Safe against user-hostile changes
  19. Tor, I2P, Freenet Bitcoin, blockchain apps BitTorrent BitMessage, PGP

  20. CONTROL

  21. Who owns the data?

  22. Who runs the servers?

  23. Who has legal control?

  24. NO MIDDLEMEN

  25. YOU ARE THE PRODUCT

  26. Who controls an app?

  27. Is that control necessary?

  28. HUMAN VALUES

  29. Tor, I2P, Freenet Bitcoin, blockchain apps BitTorrent BitMessage, PGP

  30. I want to build a social network that is safe

    against 'future Dominic' 1 Dominic Tarr
  31. "Good" web apps

  32. Promises

  33. Brewster Kahle founder, Internet Archive

  34. Why doesn't the Web reflect our values?

  35. The web has limitations 4 Web apps are trapped in

    the browser 4 Domain names, DNS 4 Location-based addressing
  36. CLIENT-SERVER MODEL

  37. PEER TO PEER

  38. None
  39. None
  40. Who does your code serve?

  41. What values does your code promote?

  42. Beginnings of a solution...

  43. WebRTC Service Workers Web Crypto Replicating databases

  44. Hyperboot

  45. Keyboot

  46. Demo hyperboot.org

  47. WebTorrent

  48. WebTorrent 4 BitTorrent in the browser 4 True P2P implementation

    4 No install - pure JavaScript with WebRTC 4 Stream into <video>, <audio>, VLC, Chromecast, Airplay, etc.
  49. Share files with WebTorrent var WebTorrent = require('webtorrent') var dragDrop

    = require('drag-drop') var client = new WebTorrent() dragDrop('body', function (files) { client.seed(files, function (torrent) { console.log('Client is now seeding', torrent.magnetURI) }) })
  50. Download files with WebTorrent var WebTorrent = require('webtorrent') var client

    = new WebTorrent() client.add('magnet:...', function (torrent) { // The first file in the torrent is a video var file = torrent.files[0] // Display the file. Supports video, audio, images, etc. file.appendTo('body') })
  51. Demo instant.io

  52. WebRTC is a backdoor 4 Companies just want browser video

    chat 4 But they've built P2P into the fabric of the web 4 Let's use this opportunity!
  53. WebRTC Data Channel

  54. Data Channel Unintended Consequences 4 Peer-assisted delivery (PeerCDDN, Peer5, others)

    4 File transfer (WebTorrent, ShareFest) 4 Ephemeral site/content hosting 4 Chat/email/encrypted real-time communications 4 All future P2P protocols!
  55. Another unintended consequence... WebRTC beyond the browser

  56. This is WebRTC Everywhere 4 WebRTC in web apps (desktop

    & mobile) 4 WebRTC in desktop apps 4 WebRTC in server apps 4 WebRTC in mobile apps
  57. WebRTC is universal

  58. Only transport that works in the browser

  59. You get NAT traversal for free

  60. No cross-origin policy

  61. Mandatory transport encryption

  62. Data Channel API is easy! var channel = peer.createDataChannel() channel.send('hi')

    channel.addEventListener('message', function (event) { console.log('got message: ' + event.data) })
  63. Where does WebRTC work today?

  64. WebRTC support in Web Apps 4 Google Chrome - supported

    4 Mozilla Firefox - supported 4 Opera - supported 4 Microsoft Edge (next IE) - planned 4 Apple Safari - no comment
  65. WebRTC support in Desktop apps 4 Electron (atom-shell) - easiest

    choice! 4 NW.js (node-webkit) - also super easy! 4 Google's webrtc.org - compile it into your app 4 Ericsson's OpenWebRTC - compile it into your app
  66. WebRTC support in Server apps 4 wrtc package on npm

    (native dep on webrtc.org) 4 Google's webrtc.org - compile it into your app 4 Ericsson's OpenWebRTC - compile it into your app
  67. WebRTC support in Mobile apps 4 iOS - Google's webrtc.org

    - compile it into your app 4 Android - Use Chromium WebView 4 Or, better: Just use Chrome/Firefox on Android!
  68. Friends

  69. Demo github.com/moose-team/friends

  70. Despite challenges, we should rally around WebRTC & ServiceWorkers

  71. We need more apps that respect & empower users

  72. Learn more hyperboot.org keyboot.org webtorrent.io moose-team.github.io/friends

  73. THE IDEAL APP

  74. Thank you! — Feross Aboukhadijeh (@feross)