WebNative: How to put a full stack directly in the browser

A presentation at Speakeasy JS in January 2021 in by Brooklyn Zelenka

Slide 1

Slide 1

🌈WebNativeπŸš€ How to put a full stack directly in the browser ✨Speakeasy JS🍻

Slide 2

Slide 2

Or:

Slide 3

Slide 3

Or: The Beginnings of a WebOS

Slide 4

Slide 4

Or: The Beginnings of a WebOS Wait, no

Slide 5

Slide 5

Or:

Slide 6

Slide 6

Or: A Browser-Based File System, Location Independence, User Controlled Data, Self-Modifying Apps, & Serverless Auth …plus some surprising things we’ve learned along the way

Slide 7

Slide 7

Brooklyn Zelenka @expede

Slide 8

Slide 8

Brooklyn Zelenka @expede β€’ CTO at Fission β€’ https://fission.codes β€’ 100% FOSS β€’ Obsoleting backends one function at a time β€’ PLT, VMs, Distributed Systems, Prev. ETH Core β€’ Founded Vancouver FP, Code & Co ee YVR ff β€’ FOSS β€” Witchcraft, Exceptional, Rescue, &c

Slide 9

Slide 9

shop.fission.codes Code: SPEAKEASYJS

Slide 10

Slide 10

Stickers! shop.fission.codes Code: SPEAKEASYJS

Slide 11

Slide 11

Slide 12

Slide 12

This is the JavaScript meetup for πŸ₯Ό mad science, πŸ§™ hacking, and πŸ§ͺ experiments SpeakeasyJS Homepage

Slide 13

Slide 13

This is the JavaScript meetup for πŸ₯Ό mad science, πŸ§™ hacking, and πŸ§ͺ experiments SpeakeasyJS Homepage

Slide 14

Slide 14

This is the JavaScript meetup for βœ… πŸ₯Ό mad science, βœ… πŸ§™ hacking, and βœ… πŸ§ͺ experiments πŸ‘ SpeakeasyJS Homepage

Slide 15

Slide 15

The Problem(s) Starting Conditions 🚦

Slide 16

Slide 16

WebNative πŸš€ The Web Today

Slide 17

Slide 17

WebNative πŸš€ The Web Today πŸ’ πŸ–₯

Slide 18

Slide 18

WebNative πŸš€ The Web Today πŸ’ πŸ–₯ 🐒

Slide 19

Slide 19

WebNative πŸš€ The Web Today πŸ’ πŸ–₯ 🐒 πŸ—ƒ

Slide 20

Slide 20

WebNative πŸš€ The Web Today πŸ’ πŸ–₯ 🐒 βš™ πŸ—ƒ

Slide 21

Slide 21

WebNative πŸš€ The Web Today πŸ’ πŸ–₯ 🐒 βš™ πŸ’ͺ πŸ—ƒ

Slide 22

Slide 22

WebNative πŸš€ The Web Today πŸ’ πŸ–₯ 🐒 βš™ πŸ’ͺ πŸ—ƒ

Slide 23

Slide 23

WebNative πŸš€ The Web Today πŸ’ πŸ’ πŸ’ πŸ–₯ 🐒 πŸ–₯ πŸ–₯ βš™ πŸ’ͺ πŸ—ƒ

Slide 24

Slide 24

WebNative πŸš€ The Web Today πŸ’ πŸ’ πŸ’ πŸ–₯ 🐒 πŸ–₯ πŸ–₯ βš™ πŸ’ͺ πŸ” πŸ—ƒ

Slide 25

Slide 25

WebNative πŸš€ The Web Today πŸ’ πŸ’ πŸ’ πŸ–₯ πŸ–₯ πŸ–₯ πŸ™ βš™ βš™ βš™ πŸ” πŸ” πŸ” πŸ—ƒ πŸ—ƒ πŸ—ƒ

Slide 26

Slide 26

WebNative πŸš€ What We Actually Want πŸ’ πŸ–₯ πŸ“ πŸ–₯ πŸ’ πŸ“ƒ

Slide 27

Slide 27

WebNative πŸš€ What We Actually Want πŸ’ πŸ–₯ πŸ“ πŸ–₯ πŸ’ πŸ“ƒ

Slide 28

Slide 28

…and so it was for many years…

Slide 29

Slide 29

…and so it was for many years… πŸ¦–β˜„πŸŒ‹πŸŒΎπŸ°πŸ’πŸš€

Slide 30

Slide 30

Is the way we do things today the β€œone true way”? Will we be doing things this way in 2025? 2050? 2100? Does knowledge always progress from good to better? Are we stuck in a local maxima?

Slide 31

Slide 31

WebNative πŸš€ Natural Consequences β€’ Server-focus β€’ Must learn more of stack β€’ Single source of truth β€’ DevOps, Docker, k8s β€’ Latency assumption β€’ FE deeply concerned with data sync

Slide 32

Slide 32

WebNative πŸš€ What Even is a β€œServer”?

  1. Auth gatekeeper (because multi-tenant data) 2. Resource availability 3. Out-of-band compute (e.g. batch tasks)

Slide 33

Slide 33

WebNative πŸš€ What Even is a β€œServer”?

  1. Auth gatekeeper (because multi-tenant data) 2. Resource availability 3. Out-of-band compute (e.g. batch tasks) s i h t r e b m e m e R ! t s i l

Slide 34

Slide 34

What if we turn the web architecture Inside Out? πŸ”

Slide 35

Slide 35

WebNative πŸš€ Like Native… but for the Web 🧐

Slide 36

Slide 36

WebNative πŸš€ Like Native… but for the Web 🧐

Slide 37

Slide 37

WebNative πŸš€ Like Native… but for the Web 🧐

Slide 38

Slide 38

WebNative πŸš€ Like Native… but for the Web 🧐

Slide 39

Slide 39

WebNative πŸš€ Like Native… but for the Web 🧐

Slide 40

Slide 40

WebNative πŸš€ Like Native… but for the Web 🧐

Slide 41

Slide 41

WebNative πŸš€ Like Native… but for the Web 🧐

Slide 42

Slide 42

WebNative πŸš€ New Assumptions, New Approach β€’ 2021 != 1991 β€’ Don’t need to rely on client/server β€’ Browsers are super powerful β€’ UI & data = only essential parts β€’ Post-serverless, edge++ β€’ New primitives (β€œgame changers”) β€’ Location independent data πŸ™Œ β€’ Browser-based encryption πŸ’ͺ β€’ Consistency models (OT, CRDTs, RAFT) 🀝 β€’ i.e. State transfer -> state synchronization β€’ New features naturally fall out of the architecture β€’ Recognize that we’re increasingly connected/networked ffi β€’ Local-first means network e cient (in the normal case)

Slide 43

Slide 43

WebNative πŸš€ Bootstrapping from Browsers APIs β€’ WebCrypto API β€’ Web Workers β€’ Service Workers β€’ IndexedDB β€’ PWA & Web App Manifest

Slide 44

Slide 44

WebNative πŸš€ How Many Steps Can We Skip?

Slide 45

Slide 45

WebNative πŸš€ How Many Steps Can We Skip? Users πŸ‘¨πŸ«πŸ‘©πŸ­πŸ§‘βš•πŸ‘· Developer πŸ‘©πŸ’»

Slide 46

Slide 46

WebNative πŸš€ How Many Steps Can We Skip? Users πŸ‘¨πŸ«πŸ‘©πŸ­πŸ§‘βš•πŸ‘· Browser πŸ–₯ REST / JSON-RPC / GraphQL ↕ Server βš™ Data Store πŸ—ƒ DevOps πŸ“€ Developer πŸ‘©πŸ’»

Slide 47

Slide 47

WebNative πŸš€ How Many Steps Can We Skip? Users πŸ‘¨πŸ«πŸ‘©πŸ­πŸ§‘βš•πŸ‘· Browser πŸ–₯ REST / JSON-RPC / GraphQL ↕ Current Server βš™ Data Store πŸ—ƒ DevOps πŸ“€ Developer πŸ‘©πŸ’»

Slide 48

Slide 48

WebNative πŸš€ How Many Steps Can We Skip? Users πŸ‘¨πŸ«πŸ‘©πŸ­πŸ§‘βš•πŸ‘· Browser πŸ–₯ REST / JSON-RPC / GraphQL ↕ Current Server βš™ Data Store πŸ—ƒ DevOps πŸ“€ Developer πŸ‘©πŸ’» Users πŸ‘¨πŸ«πŸ‘©πŸ­πŸ§‘βš•πŸ‘· Browser πŸ–₯ WebNative πŸš€ Developer πŸ‘©πŸ’»

Slide 49

Slide 49

WebNative πŸš€ How Many Steps Can We Skip? Users πŸ‘¨πŸ«πŸ‘©πŸ­πŸ§‘βš•πŸ‘· Browser πŸ–₯ REST / JSON-RPC / GraphQL ↕ Current Server βš™ Data Store πŸ—ƒ DevOps πŸ“€ Developer πŸ‘©πŸ’» Users πŸ‘¨πŸ«πŸ‘©πŸ­πŸ§‘βš•πŸ‘· Browser πŸ–₯ WebNative πŸš€ Developer πŸ‘©πŸ’» Proposed

Slide 50

Slide 50

WebNative πŸš€ How Many Steps Can We Skip? Users πŸ‘¨πŸ«πŸ‘©πŸ­πŸ§‘βš•πŸ‘· Browser πŸ–₯ Current Users πŸ‘¨πŸ«πŸ‘©πŸ­πŸ§‘βš•πŸ‘· Browser πŸ–₯ WebNative πŸš€ REST / JSON-RPC / GraphQL ↕ Developer πŸ‘©πŸ’» Server βš™ Quick iteration πŸ”„ Data Store πŸ—ƒ DevOps πŸ“€ Developer πŸ‘©πŸ’» Focus on end users πŸ’ Lower barrier to entry πŸ‘¨πŸŽ¨ Proposed

Slide 51

Slide 51

WebNative πŸš€ Constraints β€’ Vanilla browser, no plugins β€’ UX as good or better than existing β€’ Literally no distinction between local and production β€’ No server required, put it in the browser β€’ User controlled identity & data β€’ Open to participation β€’ Accessible o ine ffl β€’ At least as secure as existing apps

Slide 52

Slide 52

WebNative πŸš€ Mini-Demo

Slide 53

Slide 53

WebNative πŸš€ Mini-Demo

Slide 54

Slide 54

WebNative πŸš€ Code

Slide 55

Slide 55

WebNative πŸš€ Code Auth doesn’t even leave your browser πŸ‘†

Slide 56

Slide 56

WebNative πŸš€ Code

Slide 57

Slide 57

If React is β€œjust the view layer”, then WebNative is β€œjust the data layer” It turns out the data layer touches lots of other things

Slide 58

Slide 58

WebNative πŸš€ Stack

Slide 59

Slide 59

WebNative πŸš€ Stack 1st & 3rd Party Dev’s App Business Logic & View

Slide 60

Slide 60

WebNative πŸš€ Stack 1st & 3rd Party Dev’s App Business Logic & View API Platform Abstractions WebNative SDK

Slide 61

Slide 61

WebNative πŸš€ Stack ⬆ Apps ⬇ Core Technology 1st & 3rd Party Dev’s App Business Logic & View API Platform Abstractions WebNative SDK

Slide 62

Slide 62

WebNative πŸš€ Stack 1st & 3rd Party Dev’s App Business Logic & View API Platform Abstractions WebNative SDK ⬆ Apps ⬇ Core Technology Command/Mutation UCAN Auth & ID Read/Query Cryptree Identity did:key

Slide 63

Slide 63

WebNative πŸš€ Stack 1st & 3rd Party Dev’s App Business Logic & View API Platform Abstractions WebNative SDK ⬆ Apps ⬇ Core Technology Command/Mutation UCAN Auth & ID Read/Query Cryptree Transport DNS, IPFS, PubSub, Matrix Identity did:key

Slide 64

Slide 64

WebNative πŸš€ Stack 1st & 3rd Party Dev’s App Business Logic & View API Platform Abstractions WebNative SDK ⬆ Apps ⬇ Core Technology Durable Structured Store WebNative Database Durable File Store WebNative File System Durable Data Command/Mutation UCAN Auth & ID Read/Query Cryptree Transport DNS, IPFS, PubSub, Matrix Identity did:key

Slide 65

Slide 65

WebNative πŸš€ Stack 1st & 3rd Party Dev’s App Business Logic & View API Platform Abstractions WebNative SDK ⬆ Apps ⬇ Core Technology Broadcast Collaboration, Chat, Instant Sync Soft Realtime Store Durable Structured Store WebNative Database O ine & Async Sharing Exchange Store Durable File Store WebNative File System Durable Data Command/Mutation UCAN ffl Auth & ID Global: Aggregation, Forms, Feeds Gossip Broadcast Read/Query Cryptree Transport DNS, IPFS, PubSub, Matrix Identity did:key

Slide 66

Slide 66

WebNative πŸš€ Painting a Picture πŸ–Ό β€’ Go from zero to production on a plane ✈ β€’ Move data to compute and vice versa πŸ”„ β€’ Publish updates from inside the browser πŸš€ β€’ Code is data = self modifying apps 🐣 β€’ Anyone can be a service provider (lower bar to entry) πŸ’πŸ’ β€’ Including adversarial cooperation

Slide 67

Slide 67

Content Addressed Data

Slide 68

Slide 68

Content Addressed Data It works offline and online, totally distributed & concurrent, anyone can create or request data, & data is always changing.

Slide 69

Slide 69

Content Addressed Data It works offline and online, totally distributed & concurrent, anyone can create or request data, & data is always changing.

Slide 70

Slide 70

Content Addressed Data It works offline and online, totally distributed & concurrent, anyone can create or request data, & data is always changing. Great!

Slide 71

Slide 71

Content Addressed Data It works offline and online, totally distributed & concurrent, anyone can create or request data, & data is always changing. Great!

Slide 72

Slide 72

Content Addressed Data It works offline and online, totally distributed & concurrent, anyone can create or request data, & data is always changing. Great! How do you even get a consistent pointer?

Slide 73

Slide 73

Content Addressed Data Pushing Bytes Around 🚚

Slide 74

Slide 74

Content Addressed Data Unique Hash ~ UUID++

Slide 75

Slide 75

Content Addressed Data Unique Hash ~ UUID++

Slide 76

Slide 76

Content Addressed Data Arbitrary Content

Slide 77

Slide 77

Content Addressed Data Arbitrary Content

Slide 78

Slide 78

Content Addressed Data Location Addressing β€’ Predominantly single-source (per file) server/client β€’ Like a key/value store {ip => {path => content}} β€’ DNS maps names to IP addresses β€’ Focused on the physical network β€’ Mutable addressing β€’ www.foo.com/baz may be JSON today, but a video tomorrow β€’ …or altered content

Slide 79

Slide 79

Content Addressed Data Location Addressing β€’ Predominantly single-source (per file) server/client β€’ Like a key/value store {ip => {path => content}} β€’ DNS maps names to IP addresses β€’ Focused on the physical network β€’ Mutable addressing V I R T UA L A D D R E S S P H Y S I C A L L O C AT I O N β€’ www.foo.com/baz may be JSON today, but a video tomorrow β€’ …or altered content

Slide 80

Slide 80

Content Addressed Data Universal / Content-Based Routing β€’ A layer of abstraction above location β€’ Like a key/value store {hash(content) => content} β€’ Content hash AKA β€œcontent identifier” or CID β€’ Special β€œuniversal” relationship to content V I R T UA L A D D R E S S β€’ Focused on the data β€’ Who cares where it’s stored? β€’ E cient auto-caching β€’ Still have paths β€’ Immutable DAG ffi β€’ No loops P H Y S I C A L L O C AT I O N

Slide 81

Slide 81

Content Addressed Data Universal / Content-Based Routing β€’ A layer of abstraction above location β€’ Like a key/value store {hash(content) => content} CONTENT ID β€’ Content hash AKA β€œcontent identifier” or CID β€’ Special β€œuniversal” relationship to content V I R T UA L A D D R E S S β€’ Focused on the data β€’ Who cares where it’s stored? β€’ E cient auto-caching β€’ Still have paths β€’ Immutable DAG ffi β€’ No loops P H Y S I C A L L O C AT I O N

Slide 82

Slide 82

Content Addressed Data Hash-Linked Data

Slide 83

Slide 83

Content Addressed Data Hash-Linked Data { Qm123456…: { data: β€œHello world”, links: [ {name: β€œcompany”, hash: Qmabcdef…} {name: β€œlicense”, hash: Qmzyxwvu…} ] } }

Slide 84

Slide 84

Content Addressed Data Hash-Linked Data { { Qm123456…: { data: β€œHello world”, links: [ {name: β€œcompany”, hash: Qmabcdef…} {name: β€œlicense”, hash: Qmzyxwvu…} ] } } Qmabcdef…: { data: β€œFISSION”, links: [ {name: β€œcity”, hash: Qm1gb5sn…}, {name: β€œabout”, hash: Qmzyxwvu…} ] } }

Slide 85

Slide 85

Content Addressed Data Hash-Linked Data { { Qm123456…: { data: β€œHello world”, links: [ {name: β€œcompany”, hash: Qmabcdef…} {name: β€œlicense”, hash: Qmzyxwvu…} ] } } Qmabcdef…: { data: β€œFISSION”, links: [ {name: β€œcity”, hash: Qm1gb5sn…}, {name: β€œabout”, hash: Qmzyxwvu…} ] } } ipfs cat /ipfs/Qm123456…/company/about/founder => β€œBrooke”

Slide 86

Slide 86

Content Addressed Data Tradeoffs β€’ Equality vs identity β€’ Recovering identity from structural equality, but not vice-versa β€’ Caching is trivial β€’ Data fetches β€’ Artifacts β€’ Results of computation β€’ Zooko’s Triangle

Slide 87

Slide 87

Content Addressed Data P2P Discovery, Lookup, Transport

Slide 88

Slide 88

Content Addressed Data P2P Discovery, Lookup, Transport πŸ’

Slide 89

Slide 89

Content Addressed Data P2P Discovery, Lookup, Transport πŸ’

Slide 90

Slide 90

Content Addressed Data P2P Discovery, Lookup, Transport πŸ’

Slide 91

Slide 91

Content Addressed Data P2P Discovery, Lookup, Transport πŸ’» πŸ’» β˜• πŸ’» πŸ’

Slide 92

Slide 92

Content Addressed Data P2P Discovery, Lookup, Transport πŸ’» πŸ’» β˜• πŸ’» πŸ’

Slide 93

Slide 93

Content Addressed Data P2P Discovery, Lookup, Transport πŸ’» πŸ’» πŸ’» πŸ’» πŸ’» β˜• πŸ’» πŸ’» πŸ’ πŸ’» πŸ’» πŸ’» πŸ’» πŸ’»

Slide 94

Slide 94

Content Addressed Data P2P Discovery, Lookup, Transport πŸ’» πŸ’» πŸ’» πŸ’» πŸ’» β˜• πŸ’» πŸ’» πŸ’ πŸ’» πŸ’» πŸ’» πŸ’» πŸ’»

Slide 95

Slide 95

Content Addressed Data P2P Discovery, Lookup, Transport πŸ’» πŸ’» πŸ’» πŸ’» πŸ’» β˜• πŸ’» πŸ’» πŸ’ πŸ’» πŸ’» πŸ’» πŸ’» πŸ’»

Slide 96

Slide 96

Content Addressed Data P2P Discovery, Lookup, Transport πŸ’» πŸ’» πŸ’» πŸ’» πŸ’» β˜• πŸ’» πŸ’» πŸ’ πŸ’» πŸ’» πŸ’» πŸ’» πŸ’»

Slide 97

Slide 97

Content Addressed Data P2P Discovery, Lookup, Transport πŸ’» πŸ’» πŸ’ πŸ’»

Slide 98

Slide 98

Content Addressed Data P2P Discovery, Lookup, Transport πŸ’» πŸ’» πŸ’ πŸ’»

Slide 99

Slide 99

Content Addressed Data Mutable Pointer Broadcast: DNSLink πŸ’»πŸ–₯ πŸ–₯πŸ’» πŸ’» πŸ‘©πŸ’» ☁ πŸ”— https://yourname.example.com πŸ‘¨πŸŽ€

Slide 100

Slide 100

Content Addressed Data Mutable Pointer Broadcast: DNSLink πŸ’»πŸ–₯ πŸ–₯πŸ’» πŸ’» πŸ‘©πŸ’» ☁ πŸ”— https://yourname.example.com πŸ‘¨πŸŽ€

Slide 101

Slide 101

Content Addressed Data Mutable Pointer Broadcast: DNSLink πŸ’»πŸ–₯ πŸ–₯πŸ’» ☁ πŸ”— https://yourname.example.com TXT => CID πŸ’» πŸ‘©πŸ’» πŸ‘¨πŸŽ€

Slide 102

Slide 102

Content Addressed Data Mutable Pointer Broadcast: DNSLink πŸ’»πŸ–₯ πŸ–₯πŸ’» πŸ’» πŸ‘©πŸ’» ☁ πŸ”— https://yourname.example.com πŸ‘¨πŸŽ€

Slide 103

Slide 103

Content Addressed Data Mutable Pointer Broadcast: DNSLink πŸ’»πŸ–₯ πŸ–₯πŸ’» πŸ’» πŸ‘©πŸ’» ☁ πŸ”— https://yourname.example.com πŸ‘¨πŸŽ€

Slide 104

Slide 104

Content Addressed Data Mutable Pointer Broadcast: DNSLink πŸ’»πŸ–₯ πŸ–₯πŸ’» πŸ’» πŸ‘©πŸ’» ☁ πŸ”— https://yourname.example.com πŸ‘¨πŸŽ€

Slide 105

Slide 105

Content Addressed Data Mutable Pointer Broadcast: DNSLink πŸ’»πŸ–₯ πŸ–₯πŸ’» πŸ’» πŸ‘©πŸ’» ☁ πŸ”— https://yourname.example.com πŸ‘¨πŸŽ€

Slide 106

Slide 106

Content Addressed Data Mutable Pointer Broadcast: DNSLink πŸ’»πŸ–₯ πŸ–₯πŸ’» 🧘 ☁ πŸ”— https://yourname.example.com πŸ‘¨πŸŽ€

Slide 107

Slide 107

Content Addressed Data Mutable Pointer Broadcast: DNSLink πŸ’»πŸ–₯ πŸ–₯πŸ’» 🧘 ☁ πŸ”— https://yourname.example.com πŸ‘¨πŸŽ€

Slide 108

Slide 108

Content Addressed Data Mutable Pointer Broadcast: DNSLink πŸ’»πŸ–₯ πŸ–₯πŸ’» ☁ πŸ”— https://yourname.example.com TXT => CID 🧘 πŸ‘¨πŸŽ€

Slide 109

Slide 109

Content Addressed Data Mutable Pointer Broadcast: DNSLink πŸ’»πŸ–₯ πŸ–₯πŸ’» 🧘 ☁ πŸ”— https://yourname.example.com πŸ‘¨πŸŽ€

Slide 110

Slide 110

Content Addressed Data

Slide 111

Slide 111

Content Addressed Data So we have a universal namespace.

Slide 112

Slide 112

Content Addressed Data So we have a universal namespace.

Slide 113

Slide 113

Content Addressed Data So we have a universal namespace. Great!

Slide 114

Slide 114

Content Addressed Data So we have a universal namespace. Great!

Slide 115

Slide 115

Content Addressed Data So we have a universal namespace. Great! Well that seems pretty insecure…

Slide 116

Slide 116

Securing Data Access Fixing the Leaky Pipes 🚿

Slide 117

Slide 117

Securing Data Access Grouped by User, Not by App

Slide 118

Slide 118

Securing Data Access Grouped by User, Not by App

Slide 119

Slide 119

Securing Data Access Grouped by User, Not by App f f f Alice’s Stu Bob’s Stu Carol’s Stu

Slide 120

Slide 120

Securing Data Access Grouped by User, Not by App Bob’s Photo Gallery πŸ–Ό f f f Alice’s Stu Bob’s Stu Carol’s Stu

Slide 121

Slide 121

Securing Data Access Grouped by User, Not by App Bob’s Photo Gallery πŸ–Ό Alice’s Stu Bob’s Stu Carol’s Stu f f f Carol’s Videogame πŸ‘Ύ

Slide 122

Slide 122

Securing Data Access Grouped by User, Not by App Alice’s Stu Mu Alic sic e’s Pla 🎢 yer Bob’s Photo Gallery πŸ–Ό Bob’s Stu Carol’s Stu f f f Carol’s Videogame πŸ‘Ύ

Slide 123

Slide 123

Securing Data Access WNFS Layout

Slide 124

Slide 124

Securing Data Access WNFS Layout alice.fission.name

Slide 125

Slide 125

Securing Data Access WNFS Layout Public Photos Avatars Apps alice.fission.name

Slide 126

Slide 126

Securing Data Access WNFS Layout alice.fission.name Public Photos Avatars Private Apps Photos Apps Family Photos My Gallery

Slide 127

Slide 127

Securing Data Access WNFS Layout alice.fission.name Public Photos Avatars Private Apps Shared By Me Photos Apps Family Photos My Gallery Keys and Keys Keysand and Pointers Pointers Pointers

Slide 128

Slide 128

Securing Data Access WNFS Layout alice.fission.name Public Photos Avatars Private Apps Shared By Me Photos Apps Family Photos My Gallery Keys and Keys Keysand and Pointers Pointers Pointers Shared w/ Me Keys and Pointers

Slide 129

Slide 129

Securing Data Access Virtual Nodes

Slide 130

Slide 130

Securing Data Access Virtual Nodes Raw Node

Slide 131

Slide 131

Securing Data Access Virtual Nodes Raw Node File Node Raw Data Metadata

Slide 132

Slide 132

Securing Data Access Virtual Nodes Raw Node File Node Raw Data Metadata Directory Node Index Metadata

Slide 133

Slide 133

Securing Data Access Virtual Nodes File Node Raw Node β€’ Virtual Node Raw Data β€’ Consistent interface β€’ Arbitrary metadata β€’ Tags, creators, MIME, sources, &c Metadata Directory Node Index Metadata

Slide 134

Slide 134

Securing Data Access Hard & Soft Links

Slide 135

Slide 135

Securing Data Access Hard & Soft Links β€’ Hard links β€’ New for the web! β€’ Direct reference β€’ 2 pointers ~ duplicate

Slide 136

Slide 136

Securing Data Access Hard & Soft Links β€’ Hard links β€’ New for the web! β€’ Direct reference β€’ 2 pointers ~ duplicate β€’ Soft links β€’ Like a symlink or web link β€’ 2 pointers ~ latest β€’ May break β€’ Always some version available

Slide 137

Slide 137

Securing Data Access Hard & Soft Links β€’ Hard links β€’ New for the web! β€’ Direct reference β€’ 2 pointers ~ duplicate β€’ Soft links β€’ Like a symlink or web link β€’ 2 pointers ~ latest β€’ May break β€’ Always some version available

Slide 138

Slide 138

Securing Data Access Hard & Soft Links β€’ Hard links β€’ New for the web! β€’ Direct reference β€’ 2 pointers ~ duplicate β€’ Soft links β€’ Like a symlink or web link β€’ 2 pointers ~ latest β€’ May break β€’ Always some version available

Slide 139

Slide 139

Securing Data Access Hard & Soft Links β€’ Hard links β€’ New for the web! β€’ Direct reference β€’ 2 pointers ~ duplicate β€’ Soft links β€’ Like a symlink or web link β€’ 2 pointers ~ latest β€’ May break β€’ Always some version available

Slide 140

Slide 140

Securing Data Access Hard & Soft Links β€’ Hard links β€’ New for the web! β€’ Direct reference β€’ 2 pointers ~ duplicate β€’ Soft links β€’ Like a symlink or web link β€’ 2 pointers ~ latest β€’ May break β€’ Always some version available

Slide 141

Slide 141

Securing Data Access Persistent Versioning & Events

Slide 142

Slide 142

Securing Data Access Persistent Versioning & Events Photos@r0 Vacation Avatars@r0 beach.png caricature.jpg Revision 0

Slide 143

Slide 143

Securing Data Access Persistent Versioning & Events Photos@r0 Vacation Avatars@r0 beach.png caricature.jpg Revision 0 πŸ•™

Slide 144

Slide 144

Securing Data Access Persistent Versioning & Events Photos@r0 Photos@r1 Vacation Avatars@r0 Avatars@r1 beach.png caricature.jpg headshot.png Revision 0 Revision 1 πŸ•™

Slide 145

Slide 145

Securing Data Access Persistent Versioning & Events Photos@r0 ChildEvent Vacation Avatars@r0 beach.png caricature.jpg Photos@r1 InsertNew Revision 0 headshot.png Revision 1 πŸ•™ Avatars@r1

Slide 146

Slide 146

Securing Data Access Persistent Versioning & Events Photos@r0 ChildEvent Vacation Avatars@r0 beach.png caricature.jpg Photos@r1 InsertNew Revision 0 headshot.png Revision 1 πŸ•™ Avatars@r1

Slide 147

Slide 147

Securing Data Access Persistent Versioning & Events Photos@r0 ChildEvent Vacation Avatars@r0 beach.png caricature.jpg Photos@r1 InsertNew Revision 0 Avatars@r1 headshot.png Revision 1 πŸ•™ Generation 0

Slide 148

Slide 148

Securing Data Access Persistent Versioning & Events Generation 0 Generation 1 Photos@r0 ChildEvent Vacation Avatars@r0 beach.png caricature.jpg Photos@r1 InsertNew Revision 0 headshot.png Revision 1 πŸ•™ Avatars@r1

Slide 149

Slide 149

Securing Data Access Rearranged Photos@r1 Photos@r0 Vacation Avatars@r0 beach.png caricature.jpg Avatars@r1 headshot.png

Slide 150

Slide 150

Securing Data Access Private Nodes πŸ™ˆ CBOR Binary Encrypted Node πŸ”’ AES256 + πŸ”‘ Virtual Node = Index πŸ”‘ πŸ”‘ Metadata πŸ”‘

Slide 151

Slide 151

Securing Data Access Cryptree πŸŽ„ Virtual Node Virtual Node πŸ”‘ Index πŸ”‘ πŸ”‘ Metadata πŸ”‘ πŸ”‘ πŸ”‘ Index Metadata

Slide 152

Slide 152

Cryptree πŸŽ„ Virtual Node Virtual Node πŸ”‘ Index πŸ”‘ πŸ”‘ Metadata πŸ”‘ πŸ”‘ name: β€œbeach.jpg” revision: 42 key: β€œB374A26A71490437A…” πŸ”‘

, } , { Securing Data Access Index Metadata

Slide 153

Slide 153

πŸ”‘ Cryptree πŸŽ„ Virtual Node Virtual Node πŸ”‘ Index πŸ”‘ πŸ”‘ Metadata πŸ”‘ πŸ”‘ name: β€œbeach.jpg” revision: 42 key: β€œB374A26A71490437A…” πŸ”‘

, } , { Securing Data Access Index Metadata

Slide 154

Slide 154

πŸ”‘ Cryptree πŸŽ„ Virtual Node Virtual Node πŸ”‘ Index πŸ”‘ πŸ”‘ Metadata πŸ”‘ πŸ”‘ name: β€œbeach.jpg” revision: 42 key: β€œB374A26A71490437A…” πŸ”‘

, } , { Securing Data Access Index Metadata

Slide 155

Slide 155

Securing Data Access Subtree Read Access

Slide 156

Slide 156

Securing Data Access Encrypted Tree is Surprisingly Efficient

Slide 157

Slide 157

Securing Data Access Encrypted Tree is Surprisingly Efficient HAMT (weight 16)

Slide 158

Slide 158

Securing Data Access Encrypted Tree is Surprisingly Efficient HAMT 163 = 4,096 items (weight 16) 164 = 65,536 items

Slide 159

Slide 159

Securing Data Access Encrypted Tree is Surprisingly Efficient HAMT 163 = 4,096 items (weight 16) 164 = 65,536 items Append-only Quick Read/Write Merkleized Concurrency Friendly

Slide 160

Slide 160

Securing Data Access Encrypted Tree is Surprisingly Efficient HAMT 163 = 4,096 items (weight 16) 164 = 65,536 items Append-only Quick Read/Write Merkleized Concurrency Friendly πŸ”‘

Slide 161

Slide 161

Securing Data Access Namefilters & Hiding Paths

Slide 162

Slide 162

Securing Data Access Namefilters & Hiding Paths β€’ Bare Filter β€’ parentFilte β€’ AND bloom(SHA(aesKey) β€’ AND bloom(SHA(aesKey ++ revision) β€’ Saturation β€’ nameFilter AND bloom(SHA(nameFilter) ) ) ) r β€’ Repeat until threshold bits flipped

Slide 163

Slide 163

Securing Data Access Access-Mediated Collaborative Rooting

Slide 164

Slide 164

Securing Data Access Access-Mediated Collaborative Rooting Rev 0

Slide 165

Slide 165

Securing Data Access Access-Mediated Collaborative Rooting Rev 0

Slide 166

Slide 166

Securing Data Access Access-Mediated Collaborative Rooting Rev 0 Rev 1 (Partial)

Slide 167

Slide 167

Securing Data Access Access-Mediated Collaborative Rooting Rooting progress Rev 0 Rev 1 (Partial)

Slide 168

Slide 168

Securing Data Access Access-Mediated Collaborative Rooting Rooting progress Rev 0 Rev 1 (Partial)

Slide 169

Slide 169

Securing Data Access Access-Mediated Collaborative Rooting Rooting progress No common root at this layer! Attached via HAMT Rev 0 Rev 1 (Partial)

Slide 170

Slide 170

Securing Data Access Progressive Fast Forward Rev 0 Rev 1 (Partial)

Slide 171

Slide 171

Securing Data Access Progressive Fast Forward Rev 0 Rev 1 (Partial) Rev 2 (Partial)

Slide 172

Slide 172

Securing Data Access Progressive Fast Forward Rev 3 (Complete) Rev 0 Rev 1 (Partial) Rev 2 (Partial)

Slide 173

Slide 173

Securing Data Access Progressive Fast Forward Rev 3 (Complete) Rev 0 Rev 1 (Partial) Rev 2 (Partial)

Slide 174

Slide 174

Securing Data Access Progressive Fast Forward Rev 3 (Complete) Rev 0 Rev 1 (Partial) Rev 2 (Partial)

Slide 175

Slide 175

Securing Data Access Progressive Fast Forward Rev 3 (Complete) Rev 0 Rev 1 (Partial) Rev 2 (Partial)

Slide 176

Slide 176

Securing Data Access Progressive Fast Forward current rev + 2n Rev 3 (Complete) Rev 0 Rev 1 (Partial) Rev 2 (Partial)

Slide 177

Slide 177

Securing Data Access Progressive Fast Forward current rev + 2n Rev 3 (Complete) Rev 0 Rev 1 (Partial) Rev 2 (Partial)

Slide 178

Slide 178

Securing Data Access Progressive Fast Forward current rev + 2n β€”2m current rev + 2n Rev 3 (Complete) Rev 0 Rev 1 (Partial) Rev 2 (Partial)

Slide 179

Slide 179

Securing Data Access Progressive Fast Forward current rev + 2n β€”2m current rev + 2n Rev 3 (Complete) Rev 0 Rev 1 (Partial) Rev 2 (Partial)

Slide 180

Slide 180

Securing Data Access Progressive Fast Forward current rev + 2n β€”2m current rev + 2n Rev 3 (Complete) Rev 0 Rev 1 (Partial) Rev 2 (Partial)

Slide 181

Slide 181

Securing Data Access Progressive Fast Forward current rev + 2n β€”2m current rev + 2n O(2 * log n) Θ(1) πŸŽ‰ Rev 3 (Complete) Rev 0 Rev 1 (Partial) Rev 2 (Partial)

Slide 182

Slide 182

Securing Data Access File Sharing

Slide 183

Slide 183

Securing Data Access File Sharing Shared by Me

Slide 184

Slide 184

Securing Data Access File Sharing Shared by Me did:key:zStEksDrxkwYmpzqB did:key:zStEksDrxkwYmpzqB did:key:zStEksDrxkwYmpzqB dAQjjx1PRbHG3fq4ChGeJcYU dAQjjx1PRbHG3fq4ChGeJcYU dAQjjx1PRbHG3fq4ChGeJcYU YU44a4CBUExTTjeCbop6Uur YU44a4CBUExTTjeCbop6Uur YU44a4CBUExTTjeCbop6Uur

Slide 185

Slide 185

Securing Data Access File Sharing Shared by Me did:key:zStEksDrxkwYmpzqB did:key:zStEksDrxkwYmpzqB did:key:zStEksDrxkwYmpzqB dAQjjx1PRbHG3fq4ChGeJcYU dAQjjx1PRbHG3fq4ChGeJcYU dAQjjx1PRbHG3fq4ChGeJcYU YU44a4CBUExTTjeCbop6Uur YU44a4CBUExTTjeCbop6Uur YU44a4CBUExTTjeCbop6Uur Human Readable Name πŸ”‘ Symlink

Slide 186

Slide 186

Securing Data Access File Sharing Shared by Me did:key:zStEksDrxkwYmpzqB did:key:zStEksDrxkwYmpzqB did:key:zStEksDrxkwYmpzqB dAQjjx1PRbHG3fq4ChGeJcYU dAQjjx1PRbHG3fq4ChGeJcYU dAQjjx1PRbHG3fq4ChGeJcYU YU44a4CBUExTTjeCbop6Uur YU44a4CBUExTTjeCbop6Uur YU44a4CBUExTTjeCbop6Uur Human Readable Name πŸ”‘ Symlink

Slide 187

Slide 187

Securing Data Access File Sharing Shared by Me did:key:zStEksDrxkwYmpzqB did:key:zStEksDrxkwYmpzqB did:key:zStEksDrxkwYmpzqB dAQjjx1PRbHG3fq4ChGeJcYU dAQjjx1PRbHG3fq4ChGeJcYU dAQjjx1PRbHG3fq4ChGeJcYU YU44a4CBUExTTjeCbop6Uur YU44a4CBUExTTjeCbop6Uur YU44a4CBUExTTjeCbop6Uur Human Readable Name πŸ”‘ Symlink

Slide 188

Slide 188

Securing Data Access File Sharing Shared by Me Shared with Me did:key:zStEksDrxkwYmpzqB did:key:zStEksDrxkwYmpzqB did:key:zStEksDrxkwYmpzqB dAQjjx1PRbHG3fq4ChGeJcYU dAQjjx1PRbHG3fq4ChGeJcYU dAQjjx1PRbHG3fq4ChGeJcYU YU44a4CBUExTTjeCbop6Uur YU44a4CBUExTTjeCbop6Uur YU44a4CBUExTTjeCbop6Uur Human Readable Name πŸ”‘ Symlink

Slide 189

Slide 189

Securing Data Access

Slide 190

Slide 190

Securing Data Access So we can read recursively encrypted trees that live anywhere.

Slide 191

Slide 191

Securing Data Access So we can read recursively encrypted trees that live anywhere.

Slide 192

Slide 192

Securing Data Access So we can read recursively encrypted trees that live anywhere. Great!

Slide 193

Slide 193

Securing Data Access So we can read recursively encrypted trees that live anywhere. Great!

Slide 194

Slide 194

Securing Data Access So we can read recursively encrypted trees that live anywhere. Great! How do you do writes if a a server can’t check the content?

Slide 195

Slide 195

User Controlled, Serverless, Universal Auth & ID …and UCAN Too πŸ’ͺ

Slide 196

Slide 196

UCAN Self-Sovereign Identity πŸ”‘

Slide 197

Slide 197

UCAN Self-Sovereign Identity β€’ W3C πŸ”‘

Slide 198

Slide 198

UCAN Self-Sovereign Identity β€’ W3C β€’ Microsoft πŸ”‘

Slide 199

Slide 199

UCAN Self-Sovereign Identity β€’ W3C β€’ Microsoft β€’ Government of British Columbia πŸ”‘

Slide 200

Slide 200

UCAN Self-Sovereign Identity β€’ W3C β€’ Microsoft β€’ Government of British Columbia β€’ Based on public-key cryptography πŸ”‘

Slide 201

Slide 201

UCAN Self-Sovereign Identity β€’ W3C β€’ Microsoft β€’ Government of British Columbia β€’ Based on public-key cryptography β€’ Truly β€œuniversal” user IDs πŸ”‘

Slide 202

Slide 202

UCAN Self-Sovereign Identity β€’ W3C β€’ Microsoft β€’ Government of British Columbia β€’ Based on public-key cryptography β€’ Truly β€œuniversal” user IDs β€’ Agnostic about backing πŸ”‘

Slide 203

Slide 203

UCAN Self-Sovereign Identity β€’ W3C β€’ Microsoft β€’ Government of British Columbia β€’ Based on public-key cryptography β€’ Truly β€œuniversal” user IDs β€’ Agnostic about backing β€’ For users, devices, and more πŸ”‘

Slide 204

Slide 204

UCAN Object Capability Model (OCAP)

Slide 205

Slide 205

UCAN Object Capability Model (OCAP) β€’ ACL is β€œreactive auth” / OCAP is β€œproactive auth”

Slide 206

Slide 206

UCAN Object Capability Model (OCAP) β€’ ACL is β€œreactive auth” / OCAP is β€œproactive auth” β€’ OCAP contains all the info about access

Slide 207

Slide 207

UCAN Object Capability Model (OCAP) β€’ ACL is β€œreactive auth” / OCAP is β€œproactive auth” β€’ OCAP contains all the info about access β€’ Generally some reference, proof, or key β€’ Rights to anything directly created (parenthood) β€’ The right to delegate subset of access to another (introduction)

Slide 208

Slide 208

UCAN Object Capability Model (OCAP) β€’ ACL is β€œreactive auth” / OCAP is β€œproactive auth” β€’ OCAP contains all the info about access β€’ Generally some reference, proof, or key β€’ Rights to anything directly created (parenthood) β€’ The right to delegate subset of access to another (introduction) β€’ Long history (e.g. X.509, SDSI, SPKI, Macaroons)

Slide 209

Slide 209

UCAN 3rd-party Redelegation & Attenuation

Slide 210

Slide 210

UCAN 3rd-party Redelegation & Attenuation πŸ–₯

Slide 211

Slide 211

UCAN 3rd-party Redelegation & Attenuation πŸ–₯ βš™

Slide 212

Slide 212

UCAN 3rd-party Redelegation & Attenuation πŸ–₯ πŸ”Ÿ βš™

Slide 213

Slide 213

UCAN 3rd-party Redelegation & Attenuation πŸ–₯ πŸ”Ÿ βš™ πŸ› 

Slide 214

Slide 214

UCAN 3rd-party Redelegation & Attenuation πŸ–₯ πŸ”Ÿ βš™ 2⃣ πŸ› 

Slide 215

Slide 215

UCAN JWT

Slide 216

Slide 216

UCAN Auth Chaining β€’ OCAP, provable chains, revocable β€’ Non-exportable 2048-bit RSA (WebCrypto), Ed25519 & BLS everywhere else

Slide 217

Slide 217

UCAN OAuth vs UCAN Sequence

Slide 218

Slide 218

UCAN OAuth vs UCAN Sequence

Slide 219

Slide 219

UCAN OAuth vs UCAN Sequence (Verifiable & user originated)

Slide 220

Slide 220

Final Thoughts πŸ™Š

Slide 221

Slide 221

Final Thoughts More Coming β€” Embarrassingly Distributed Deductive Database

Slide 222

Slide 222

Final Thoughts More Coming β€” Embarrassingly Distributed Deductive Database Source I

Slide 223

Slide 223

Final Thoughts More Coming β€” Embarrassingly Distributed Deductive Database Source I User+App A

Slide 224

Slide 224

Final Thoughts More Coming β€” Embarrassingly Distributed Deductive Database Source I User+App A Source II

Slide 225

Slide 225

Final Thoughts More Coming β€” Embarrassingly Distributed Deductive Database B Source II Us e r+A pp Source I User+App A

Slide 226

Slide 226

Final Thoughts More Coming β€” Embarrassingly Distributed Deductive Database pp D User+App C User+App A B r+A r+A Us e Us e Source II pp Source I

Slide 227

Slide 227

Final Thoughts More Coming β€” Embarrassingly Distributed Deductive Database β€’ Assert, refute, time, source D User+App C β€’ Merge / split easily β€’ Access control = di erent views β€’ JSON in the front, Datalog in the back πŸ§‘πŸŽ€ β€’ Help define API? calendly.com/walkah ff pp User+App A B r+A r+A Us e Us e Source II pp Source I

Slide 228

Slide 228

Final Thoughts More Coming β€” Universal Distributed Compute Off-Platform Side Effect Stream Platform Effect Stream Pure Function Stream Base Event Stream

Slide 229

Slide 229

Final Thoughts Stack 1st & 3rd Party Dev’s App Business Logic & View API Platform Abstractions WebNative SDK ⬆ Apps ⬇ Core Technology Broadcast Collaboration, Chat, Instant Sync Soft Realtime Store Durable Structured Store WebNative Database O ine & Async Sharing Exchange Store Durable File Store WebNative File System Durable Data Command/Mutation UCAN ffl Auth & ID Global: Aggregation, Forms, Feeds Gossip Broadcast Read/Query Cryptree Networking DNS, IPFS, PubSub, Matrix Identity did:key

Slide 230

Slide 230

Final Thoughts 60+ Year Trend

Slide 231

Slide 231

Final Thoughts 60+ Year Trend High Touch Invisible Custom Product / Rental Commodity / Utility

Slide 232

Slide 232

Final Thoughts 60+ Year Trend High Touch Ba rrie r to Ent ry Invisible Custom Product / Rental Commodity / Utility

Slide 233

Slide 233

Final Thoughts 60+ Year Trend High Touch Bespoke Private Ownership Ba rrie r to Ent ry Shared Hosting Serverless Universal Invisible Custom Product / Rental Commodity / Utility

Slide 234

Slide 234

https://fission.codes https://guide.fission.codes https://discord.gg/zAQBDEq πŸ˜„ Thank You, Speakeasy JS πŸŽ‰ brooklyn@fission.codes github.com/expede @expede shop.fission.codes Code: SPEAKEASYJS