Collaboration with
Con
fl
ict Free Replicated Datatypes
(CRDTs)
What are CRDTs?
What are CRDTs?
Datatypes
Arrays
Maps
Text
Counters
Registers
...
Shared Datatypes?
CRDTs
Computer A
CRDTs
Computer B
Changes
Shared Datatypes?
CRDTs
Computer A
CRDTs
Computer B
Changes
Shared Datatypes?
Project X Document
Lorem ipsum dolor sit amet,
consectetuer adipiscing elit.
Aenean commodo ligula eget
dolor
Donec quam felis, ultricies nec,
pellentesque eu, pretium quis,
sem. Nulla consequat massa quis
enim
Donec pede justo, fringilla vel,
aliquet nec, vulputate eget, arcu
Computer A
Project X Document
Lorem ipsum dolor sit amet,
consectetuer adipiscing elit.
Aenean commodo ligula eget
dolor
Donec quam felis, ultricies nec,
pellentesque eu, pretium quis,
sem. Nulla consequat massa quis
enim
Donec pede justo, fringilla vel,
aliquet nec, vulputate eget, arcu
Computer B
Shared Datatypes?
Project X Document
Lorem ipsum dolor sit amet,
consectetuer adipiscing elit.
Aenean commodo ligula eget
dolor elementum
Donec quam felis, ultricies nec,
pellentesque eu, pretium quis,
sem. Nulla consequat massa quis
enim
Donec pede justo, fringilla vel,
aliquet nec, vulputate eget, arcu
Computer A
Project X Document
Lorem ipsum dolor sit amet,
consectetuer adipiscing elit.
Aenean commodo ligula eget
dolor
Donec quam felis, ultricies nec,
pellentesque eu, pretium quis,
sem. Nulla consequat massa quis
enim
Donec pede justo, fringilla vel,
aliquet nec, vulputate eget, arcu
Computer B
elementum
Shared Datatypes?
Project X Document
Lorem ipsum dolor sit amet,
consectetuer adipiscing elit.
Aenean commodo ligula eget
dolor elementum
Donec quam felis, ultricies nec,
pellentesque eu, pretium quis,
sem. Nulla consequat massa quis
enim
Donec pede justo, fringilla vel,
aliquet nec, vulputate eget, arcu
Computer A
Project X Document
Lorem ipsum dolor sit amet,
consectetuer adipiscing elit.
Aenean commodo ligula eget
dolor
Donec quam felis, ultricies nec,
pellentesque eu, pretium quis,
sem. Nulla consequat massa quis
enim
Donec pede justo, fringilla vel,
aliquet nec, vulputate eget, arcu
Computer B
elementum
Shared Datatypes?
Project X Document
Lorem ipsum dolor sit amet,
consectetuer adipiscing elit.
Aenean commodo ligula eget
dolor elementum
Donec quam felis, ultricies nec,
pellentesque eu, pretium quis,
sem. Nulla consequat massa quis
enim
Donec pede justo, fringilla vel,
aliquet nec, vulputate eget, arcu
Computer A
Project X Document
Lorem ipsum dolor sit amet,
consectetuer adipiscing elit.
Aenean commodo ligula eget
dolor
Donec quam felis, ultricies nec,
pellentesque eu, pretium quis,
sem. Nulla consequat massa quis
enim ullamcorper
Donec pede justo, fringilla vel,
aliquet nec, vulputate eget, arcu
Computer B
elementum
ullamcorper
Project X Document
Lorem ipsum dolor sit amet,
consectetuer adipiscing elit.
Aenean commodo ligula eget
dolor elementum
Donec quam felis, ultricies nec,
pellentesque eu, pretium quis,
sem. Nulla consequat massa quis
enim
Donec pede justo, fringilla vel,
aliquet nec, vulputate eget, arcu
Computer A
Shared Datatypes?
Project X Document
Lorem ipsum dolor sit amet,
consectetuer adipiscing elit.
Aenean commodo ligula eget
dolor
Donec quam felis, ultricies nec,
pellentesque eu, pretium quis,
sem. Nulla consequat massa quis
enim ullamcorper
Donec pede justo, fringilla vel,
aliquet nec, vulputate eget, arcu
Computer B
elementum
ullamcorper
More than just
collaborative text editing...
About that example
It's about collaboration
in general
About that example
Working together
on a shared task
Collaboration?
Project X Document
Lorem ipsum dolor sit amet,
consectetuer adipiscing elit.
Aenean commodo ligula eget
dolor elementum
Donec quam felis, ultricies nec,
pellentesque eu, pretium quis,
sem. Nulla consequat massa quis
enim
Donec pede justo, fringilla vel,
aliquet nec, vulputate eget, arcu
Computer A
Project X Document
Lorem ipsum dolor sit amet,
consectetuer adipiscing elit.
Aenean commodo ligula eget
dolor
Donec quam felis, ultricies nec,
pellentesque eu, pretium quis,
sem. Nulla consequat massa quis
enim ullamcorper
Donec pede justo, fringilla vel,
aliquet nec, vulputate eget, arcu
Computer B
Asynchronously
Project X Document
Lorem ipsum dolor sit amet,
consectetuer adipiscing elit.
Aenean commodo ligula eget
dolor elementum
Donec quam felis, ultricies nec,
pellentesque eu, pretium quis,
sem. Nulla consequat massa quis
enim
Donec pede justo, fringilla vel,
aliquet nec, vulputate eget, arcu
Computer A
Project X Document
Lorem ipsum dolor sit amet,
consectetuer adipiscing elit.
Aenean commodo ligula eget
dolor
Donec quam felis, ultricies nec,
pellentesque eu, pretium quis,
sem. Nulla consequat massa quis
enim ullamcorper
Donec pede justo, fringilla vel,
aliquet nec, vulputate eget, arcu
Computer B
Concurrently
Collaboration
Humans
Collaboration
Actors
What is collaborative software?
"collaborative software"
What examples come to mind?
Most software isn't
really collaborative
Most software isn't really collaborative
Why?
Why?
It's not easy
Project X Document
Lorem ipsum dolor sit amet,
consectetuer adipiscing elit.
Aenean commodo ligula eget
dolor elementum
Donec quam felis, ultricies nec,
pellentesque eu, pretium quis,
sem. Nulla consequat massa quis
enim
Donec pede justo, fringilla vel,
aliquet nec, vulputate eget, arcu
Computer A
Project X Document
Lorem ipsum dolor sit amet,
consectetuer adipiscing elit.
Aenean commodo ligula eget
dolor
Donec quam felis, ultricies nec,
pellentesque eu, pretium quis,
sem. Nulla consequat massa quis
enim ullamcorper
Donec pede justo, fringilla vel,
aliquet nec, vulputate eget, arcu
Computer B
If you had to build this...
We need better tools...
And that's what
CRDTs offer
CRDTs
How do you
use them?
How do they work?
De
fi
ne the shape
of your data
model
De
fi
ne the shape of your model...
CRDTs
Arrays
Maps
Sets
Registers
Counters
...
Arrays
Maps
Sets
Registers
Application
data model
How is data replicated
CRDTs
Application
data model
Application
data model
CRDTs
How is data replicated
CRDTs
Application
data model
Application
data model
CRDTs
Server
How is data replicated
CRDTs
Application
data model
Application
data model
CRDTs
No server required!
CRDTs
CRDTs
How do they
work?
CRDTs
Created following rules...
info to
merge changes
w/o con
fl
ict
To fully understand CRDTs...
Order theory
join semi-lattices
You probably don't need to know...
Order theory
unless you're a
CRDT library author
Still curious...
How CRDTs work?
First look at CRDTs
CRDT Counter
Counting things on a conveyor...
≤
Count: 2
1
0
Counting people entering a concert...
Counting people entering a concert...
Total Count
+ -
Total Count
+ -
Total Count
+ -
0 0 0
1 1 1
2 2 2
3 3 3
≤
Count: 2 Total Count
+ -
3 Total Count
+ -
3
Total Count
+ -
Total Count
+ -
Total Count
+ -
0 0 0
1 1 1
Can we use primitives?
// model
count = ;
// model
count = 0;
// model
count = 0;
0 0 0
1
1
1
Total Count
+ -
Total Count
+ -
Total Count
+ -
1 1 1
2 2 2
3 3 3
Can we use primitives?
// model
count = ;
// model
count = 0;
// model
count = 0;
0 1 1
1
1
1 2
2
2 2
2
2
Total Count
+ -
Total Count
+ -
Total Count
+ -
0 0 0
Can we use primitives?
// model
count = 0;
// model
count = 0;
// model
count = 0;
Total Count
+ -
Total Count
+ -
Total Count
+ -
0 0 0
Can we use primitives?
// model
count = 0;
// model
count = 0;
// model
count = 0;
Total Count
+ -
Total Count
+ -
Total Count
+ -
0 0 0
CRDT Counter
// model
counter =
new CRDTCounter();
// model
counter =
new CRDTCounter();
// model
counter =
new CRDTCounter();
Total Count
+ -
Total Count
+ -
Total Count
+ -
0 0 0
// model
counter =
new CRDTCounter();
// increment
counter.increment(1);
// model
counter =
new CRDTCounter();
// increment
counter.increment(1);
// model
counter =
new CRDTCounter();
// increment
counter.increment(1);
CRDT Counter
Total Count
+ -
Total Count
+ -
Total Count
+ -
0 0 0
// model
id = 100;
count = {}
// model
id = 200;
count = {}
// model
id = 300;
count = {}
CRDT Counter
Total Count
+ -
Total Count
+ -
Total Count
+ -
0 0 0
// model
id = 100;
count = {}
// model
id = 200;
count = {}
// model
id = 300;
count = {}
CRDT Counter
Total Count
+ -
Total Count
+ -
Total Count
+ -
0 0 0
// model
id = 100;
count = {}
// model
id = 200;
count = {}
// model
id = 300;
count = {}
100
CRDT Counter
Total Count
+ -
Total Count
+ -
Total Count
+ -
0 0 0
// model
id = 100;
count = {
:
}
// model
id = 200;
count = {}
// model
id = 300;
count = {}
100 1
1
CRDT Counter
{
100: 1
}
{
100: 1
}
Total Count
+ -
Total Count
+ -
Total Count
+ -
0 0
// model
id = 100;
count = {
:
}
// model
id = 200;
count = {
}
// model
id = 300;
count = {
}
100 1
1
CRDT Counter
{
100: 1
}
{
100: 1
}
1 1
Total Count
+ -
Total Count
+ -
Total Count
+ -
// model
id = 100;
count = {
:
}
// model
id = 200;
count = {
}
// model
id = 300;
count = {
}
100 1
1
CRDT Counter
{
100: 1
}
{
100: 1
}
1 1
Total Count
+ -
Total Count
+ -
Total Count
+ -
// model
id = 100;
count = {
:
}
// model
id = 200;
count = {
}
// model
id = 300;
count = {
}
100 1
1
CRDT Counter
{
100: 1
}
{
100: 1
}
1 1
200 300
Total Count
+ -
Total Count
+ -
Total Count
+ -
// model
id = 100;
count = {
:
}
// model
id = 200;
count =
// model
id = 300;
count =
100 1
1
CRDT Counter
1 1
{
100: 1,
:
}
{
100: 1,
:
}
200 300
1 1
2 2 300: 1
300: 1
200: 1
200: 1
Total Count
+ -
Total Count
+ -
Total Count
+ -
// model
id = 100;
count = {
: ,
}
// model
id = 200;
count =
// model
id = 300;
count =
100 1
1
CRDT Counter
{
100: 1,
:
}
{
100: 1,
: ,
}
200 300
1 1
2 2 300: 1
300: 1
200: 1
200: 1
3
Total Count
+ -
Total Count
+ -
Total Count
+ -
// model
id = 100;
count = {
: ,
}
// model
id = 200;
count =
// model
id = 300;
count =
100 1
1
CRDT Counter
{
100: 1,
:
}
{
100: 1,
: ,
}
200 300
1 1
2 300: 1
300: 1
200: 1
200: 1
3
2
Total Count
+ -
Total Count
+ -
Total Count
+ -
// model
id = 100;
count = {
: ,
,
}
// model
id = 200;
count =
// model
id = 300;
count =
100 1
CRDT Counter
{
100: 1,
: ,
}
{
100: 1,
: ,
}
200 300
1 1
2 300: 1
300: 1 200: 1
200: 1
3
2
3 3
Total Count
+ -
Total Count
+ -
Total Count
+ -
// model
id = 100;
count = {
: ,
,
}
// model
id = 200;
count =
// model
id = 300;
count =
100 1
CRDT Counter
{
100: 1,
: ,
}
{
100: 1,
: ,
}
200 300
1 1
300: 1
300: 1 200: 1
200: 1
3
3 3
CRDT Tradeoffs
Extra Memory / Metadata
Strong Eventual Consistancy
Networking Protocols
Websockets
WebRTC
...
Local First
No spinners
Multi device
Network optional
Data ownership
Libraries to look at
Yjs (JavaScript)
Automerge (JavaScript)
Y-crdt (Rust)
diamond-types (Rust)
Q & A

Conflict Free Replicated Data Types

  • 1.
    Collaboration with Con fl ict FreeReplicated Datatypes (CRDTs)
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
    Shared Datatypes? Project XDocument Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu Computer A Project X Document Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu Computer B
  • 7.
    Shared Datatypes? Project XDocument Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor elementum Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu Computer A Project X Document Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu Computer B elementum
  • 8.
    Shared Datatypes? Project XDocument Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor elementum Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu Computer A Project X Document Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu Computer B elementum
  • 9.
    Shared Datatypes? Project XDocument Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor elementum Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu Computer A Project X Document Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim ullamcorper Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu Computer B elementum ullamcorper
  • 10.
    Project X Document Loremipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor elementum Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu Computer A Shared Datatypes? Project X Document Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim ullamcorper Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu Computer B elementum ullamcorper
  • 11.
    More than just collaborativetext editing... About that example
  • 12.
    It's about collaboration ingeneral About that example
  • 13.
    Working together on ashared task Collaboration?
  • 14.
    Project X Document Loremipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor elementum Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu Computer A Project X Document Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim ullamcorper Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu Computer B Asynchronously
  • 15.
    Project X Document Loremipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor elementum Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu Computer A Project X Document Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim ullamcorper Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu Computer B Concurrently
  • 16.
  • 17.
  • 18.
  • 21.
  • 25.
  • 26.
    Most software isn'treally collaborative Why?
  • 27.
  • 28.
    Project X Document Loremipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor elementum Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu Computer A Project X Document Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim ullamcorper Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu Computer B If you had to build this...
  • 29.
    We need bettertools... And that's what CRDTs offer
  • 30.
  • 31.
    How do theywork? De fi ne the shape of your data model
  • 32.
    De fi ne the shapeof your model... CRDTs Arrays Maps Sets Registers Counters ... Arrays Maps Sets Registers Application data model
  • 33.
    How is datareplicated CRDTs Application data model Application data model CRDTs
  • 34.
    How is datareplicated CRDTs Application data model Application data model CRDTs Server
  • 35.
    How is datareplicated CRDTs Application data model Application data model CRDTs
  • 36.
  • 37.
  • 38.
    CRDTs Created following rules... infoto merge changes w/o con fl ict
  • 39.
    To fully understandCRDTs... Order theory join semi-lattices
  • 40.
    You probably don'tneed to know... Order theory unless you're a CRDT library author
  • 41.
  • 42.
    First look atCRDTs CRDT Counter
  • 43.
    Counting things ona conveyor... ≤ Count: 2 1 0
  • 44.
  • 45.
    Counting people enteringa concert... Total Count + - Total Count + - Total Count + - 0 0 0 1 1 1 2 2 2 3 3 3
  • 46.
    ≤ Count: 2 TotalCount + - 3 Total Count + - 3
  • 47.
    Total Count + - TotalCount + - Total Count + - 0 0 0 1 1 1 Can we use primitives? // model count = ; // model count = 0; // model count = 0; 0 0 0 1 1 1
  • 48.
    Total Count + - TotalCount + - Total Count + - 1 1 1 2 2 2 3 3 3 Can we use primitives? // model count = ; // model count = 0; // model count = 0; 0 1 1 1 1 1 2 2 2 2 2 2
  • 49.
    Total Count + - TotalCount + - Total Count + - 0 0 0 Can we use primitives? // model count = 0; // model count = 0; // model count = 0;
  • 50.
    Total Count + - TotalCount + - Total Count + - 0 0 0 Can we use primitives? // model count = 0; // model count = 0; // model count = 0;
  • 51.
    Total Count + - TotalCount + - Total Count + - 0 0 0 CRDT Counter // model counter = new CRDTCounter(); // model counter = new CRDTCounter(); // model counter = new CRDTCounter();
  • 52.
    Total Count + - TotalCount + - Total Count + - 0 0 0 // model counter = new CRDTCounter(); // increment counter.increment(1); // model counter = new CRDTCounter(); // increment counter.increment(1); // model counter = new CRDTCounter(); // increment counter.increment(1); CRDT Counter
  • 53.
    Total Count + - TotalCount + - Total Count + - 0 0 0 // model id = 100; count = {} // model id = 200; count = {} // model id = 300; count = {} CRDT Counter
  • 54.
    Total Count + - TotalCount + - Total Count + - 0 0 0 // model id = 100; count = {} // model id = 200; count = {} // model id = 300; count = {} CRDT Counter
  • 55.
    Total Count + - TotalCount + - Total Count + - 0 0 0 // model id = 100; count = {} // model id = 200; count = {} // model id = 300; count = {} 100 CRDT Counter
  • 56.
    Total Count + - TotalCount + - Total Count + - 0 0 0 // model id = 100; count = { : } // model id = 200; count = {} // model id = 300; count = {} 100 1 1 CRDT Counter { 100: 1 } { 100: 1 }
  • 57.
    Total Count + - TotalCount + - Total Count + - 0 0 // model id = 100; count = { : } // model id = 200; count = { } // model id = 300; count = { } 100 1 1 CRDT Counter { 100: 1 } { 100: 1 } 1 1
  • 58.
    Total Count + - TotalCount + - Total Count + - // model id = 100; count = { : } // model id = 200; count = { } // model id = 300; count = { } 100 1 1 CRDT Counter { 100: 1 } { 100: 1 } 1 1
  • 59.
    Total Count + - TotalCount + - Total Count + - // model id = 100; count = { : } // model id = 200; count = { } // model id = 300; count = { } 100 1 1 CRDT Counter { 100: 1 } { 100: 1 } 1 1 200 300
  • 60.
    Total Count + - TotalCount + - Total Count + - // model id = 100; count = { : } // model id = 200; count = // model id = 300; count = 100 1 1 CRDT Counter 1 1 { 100: 1, : } { 100: 1, : } 200 300 1 1 2 2 300: 1 300: 1 200: 1 200: 1
  • 61.
    Total Count + - TotalCount + - Total Count + - // model id = 100; count = { : , } // model id = 200; count = // model id = 300; count = 100 1 1 CRDT Counter { 100: 1, : } { 100: 1, : , } 200 300 1 1 2 2 300: 1 300: 1 200: 1 200: 1 3
  • 62.
    Total Count + - TotalCount + - Total Count + - // model id = 100; count = { : , } // model id = 200; count = // model id = 300; count = 100 1 1 CRDT Counter { 100: 1, : } { 100: 1, : , } 200 300 1 1 2 300: 1 300: 1 200: 1 200: 1 3 2
  • 63.
    Total Count + - TotalCount + - Total Count + - // model id = 100; count = { : , , } // model id = 200; count = // model id = 300; count = 100 1 CRDT Counter { 100: 1, : , } { 100: 1, : , } 200 300 1 1 2 300: 1 300: 1 200: 1 200: 1 3 2 3 3
  • 64.
    Total Count + - TotalCount + - Total Count + - // model id = 100; count = { : , , } // model id = 200; count = // model id = 300; count = 100 1 CRDT Counter { 100: 1, : , } { 100: 1, : , } 200 300 1 1 300: 1 300: 1 200: 1 200: 1 3 3 3
  • 65.
    CRDT Tradeoffs Extra Memory/ Metadata Strong Eventual Consistancy
  • 66.
  • 67.
    Local First No spinners Multidevice Network optional Data ownership
  • 68.
    Libraries to lookat Yjs (JavaScript) Automerge (JavaScript) Y-crdt (Rust) diamond-types (Rust)
  • 69.