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

The Science of Etherpad

Avatar for Tim Cameron Ryan Tim Cameron Ryan
May 14, 2012
Programming
2
64

The Science of Etherpad

How does Operational Transform work?

Avatar for Tim Cameron Ryan

Tim Cameron Ryan

May 14, 2012
Tweet

More Decks by Tim Cameron Ryan

See All by Tim Cameron Ryan
BayNode Meetup June 2014
Avatar for Tim Cameron Ryan tcr
1
81
Elevator redesign: Team Unibros Final Presentation
Avatar for Tim Cameron Ryan tcr
0
430

Other Decks in Programming

See All in Programming
猫の手も借りたい！ので AIエージェント猫を作って社内に放した話 Claude Code × Container Lambda の Slack Bot "DevNeko"
Avatar for naramomi7 naramomi7
0
260
Rで始めるML・LLM活用入門
Avatar for wakama1994 wakamatsu_takumu
0
180
「やめとこ」がなくなった — 1月にZennを始めて22本書いた AI共創開発のリアル
Avatar for atani atani14
0
380
AWS×クラウドネイティブソフトウェア設計 / AWS x Cloud-Native Software Design
Avatar for nrs nrslib
16
3.1k
コーディングルールの鮮度を保ちたい / keep-fresh-go-internal-conventions
Avatar for NAGATA Hiroaki handlename
0
200
Goの型安全性で実現する複数プロダクトの権限管理
Avatar for ishikawa-pro ishikawa_pro
2
320
Claude Code の Skill で複雑な既存仕様をすっきり整理しよう
Avatar for yuichiro_takahashi yuichirokato
1
370
How to stabilize UI tests using XCTest
Avatar for Akio Itaya akkeylab
0
120
AIコードレビューの導入・運用と AI駆動開発における「AI4QA」の取り組みについて
Avatar for ハゲワシ hagevvashi
0
460
AWS Infrastructure as Code の新機能 2025 総まとめ 〜SA 4人による怒涛のデモ祭り〜
Avatar for Kenji Kono konokenj
10
3.4k
AI時代のシステム設計：ドメインモデルで変更しやすさを守る設計戦略
Avatar for 増田 亨 masuda220
PRO
5
990
メタプログラミングで実現する「コードを仕様にする」仕組み/nikkei-tech-talk43
Avatar for 日本経済新聞社 エンジニア採用事務局 nikkei_engineer_recruiting
0
180

Featured

See All Featured
Jamie Indigo - Trashchat’s Guide to Black Boxes: Technical SEO Tactics for LLMs
Avatar for Tech SEO Connect techseoconnect
PRO
0
83
Balancing Empowerment & Direction
Avatar for Lara Hogan lara
5
940
Done Done
Avatar for chrislema chrislema
186
16k
ラッコキーワード サービス紹介資料
Avatar for ラッコ株式会社 rakko
1
2.6M
Ten Tips & Tricks for a 🌱 transition
Avatar for Manu Carrasco Molina stuffmc
0
87
From Legacy to Launchpad: Building Startup-Ready Communities
Avatar for Dug Song dugsong
0
170
Practical Tips for Bootstrapping Information Extraction Pipelines
Avatar for Matthew Honnibal honnibal
25
1.8k
HDC tutorial
Avatar for Michiel Stock michielstock
1
540
Test your architecture with Archunit
Avatar for Yoan thirion
1
2.2k
We Are The Robots
Avatar for Honza Javorek honzajavorek
0
200
エンジニアに許された特別な時間の終わり
Avatar for watany watany
106
240k
A Modern Web Designer's Workflow
Avatar for Chris Coyier chriscoyier
698
190k

Transcript

  1. THE SCIENCE OF ETHERPAD MAKING ANY DOCUMENT COLLABORATIVE, ANYWHERE

  2. Operations

  3. app

  4. apple

  5. “app” + ”le”

  6. app Operation 1 1.  insertCharacter “a” 2.  insertCharacter “p” 3. 

    insertCharacter “p“

  7. apple Operation 2 1.  retain (skip character) 2.  retain (skip

    character) 3.  retain (skip character) 4.  insertCharacter “l” 5.  insertCharacter “e“

  8. applecore Operation 2 1.  retain (skip character) 2.  retain (skip

    character) 3.  retain (skip character) 4.  retain (skip character) 5.  retain (skip character) 6.  insertCharacter “c” 7.  insertCharacter “o“ 8.  insertCharacter “r“ 9.  insertCharacter “e“

  9. Composition

  10. appl Operation 1 1.  retain (skip character) 2.  retain (skip

    character) 3.  retain (skip character) 4.  insertCharacter “l” apple Operation 2 1.  retain (skip character) 2.  retain (skip character) 3.  retain (skip character) 4.  retain (skip character) 5.  insertCharacter “e”

  11. Operation 1+2 1.  retain (skip character) 2.  retain (skip character)

    3.  retain (skip character) 4.  insertCharacter “l” 5.  insertCharacter “e“ appl apple

  12. Concurrency

  13. app app CLIENT A CLIENT B

  14. appl appe CLIENT A CLIENT B

  15. appl Operation A 1.  retain (skip character) 2.  retain (skip

    character) 3.  retain (skip character) 4.  insertCharacter “l” appe Operation B 1.  retain (skip character) 2.  retain (skip character) 3.  retain (skip character) 4.  insertCharacter “e” CLIENT A CLIENT B

  16. appl Operation B 1.  retain (skip character) 2.  retain (skip

    character) 3.  retain (skip character) 4.  insertCharacter “e” appe Operation A 1.  retain (skip character) 2.  retain (skip character) 3.  retain (skip character) 4.  insertCharacter “l” CLIENT A CLIENT B

  17. appel Operation B 1.  retain (skip character) 2.  retain (skip

    character) 3.  retain (skip character) 4.  insertCharacter “e” apple Operation A 1.  retain (skip character) 2.  retain (skip character) 3.  retain (skip character) 4.  insertCharacter “l” CLIENT A CLIENT B

  18. appel apple CLIENT A CLIENT B

  19. Operational Transform

  20. “A theoretical framework of concurrency control” that “provides a mechanism

    for sanely resolving [editing] conflicts so that neither user intervention or locking become necessary.” A mechanism to “transform” two operations in conflict, resulting in two new operations which bring both clients into a common state.

  21. app app CLIENT A CLIENT B SERVER

  22. appl Operation A 1.  retain (skip character) 2.  retain (skip

    character) 3.  retain (skip character) 4.  insertCharacter “l” CLIENT A SERVER 1 appe Operation B 1.  retain (skip character) 2.  retain (skip character) 3.  retain (skip character) 4.  insertCharacter “e” CLIENT B 2

  23. Operation A 1.  retain (skip character) 2.  retain (skip character)

    3.  retain (skip character) 4.  insertCharacter “l” SERVER TRANSFORM Operation B 1.  retain (skip character) 2.  retain (skip character) 3.  retain (skip character) 4.  insertCharacter “e” Operation B` 1.  retain (skip character) 2.  retain (skip character) 3.  retain (skip character) 4.  retain (skip character) 5.  insertCharacter “e” Operation A` 1.  retain (skip character) 2.  retain (skip character) 3.  retain (skip character) 4.  insertCharacter “l” 5.  retain (skip character)

  24. appl Operation B` 1.  retain (skip character) 2.  retain (skip

    character) 3.  retain (skip character) 4.  retain (skip character) 5.  insertCharacter “e” CLIENT A SERVER appe Operation A` 1.  retain (skip character) 2.  retain (skip character) 3.  retain (skip character) 4.  insertCharacter “l” 5.  retain (skip character) CLIENT B B` A`

  25. apple Operation B` 1.  retain (skip character) 2.  retain (skip

    character) 3.  retain (skip character) 4.  retain (skip character) 5.  insertCharacter “e” CLIENT A SERVER apple Operation A` 1.  retain (skip character) 2.  retain (skip character) 3.  retain (skip character) 4.  insertCharacter “l” 5.  retain (skip character) CLIENT B B` A`

  26. apple apple CLIENT A CLIENT B

  27. CLIENT A CLIENT B A1: retain 3, insert “l” Broadcast

    A1 Apply A1` SERVER

  28. CLIENT A CLIENT B SERVER A1: retain 3, insert “l”

    B1: retain 3, insert “e” Transform A1 x B1 Apply A1` Apply B1`

  29. CLIENT A CLIENT B SERVER A1: retain 3, insert “l”

    B1: retain 3, insert “e” A2: retain 4, insert “core” Transform A1 x B1 Apply A1` Transform A2 x B1` Apply B1`` Broadcast A2 Apply A2`

  30. CLIENT A CLIENT B SERVER A1: retain 3, insert “l”

    B1: retain 3, insert “e” A2: retain 4, insert “core” Transform A1 x B1 B2: retain 4, insert “sauce” Transform B2 x A1` Apply A1`` Transform A2 x B1` Apply B1`` Transform A2` x B2` Apply A2`` Apply B2``

  31. CLIENT A CLIENT B SERVER A1: retain 3, insert “l”

    B1: retain 3, insert “e” A2: retain 4, insert “core” Transform A1 x B1 B2: retain 4, insert “sauce” Transform B2 x A1` Apply A1`` Transform A2 x B1` Apply B1`` Transform A2` x B2` Apply A2`` Apply B2``

  32. Markup

  33. big apple

  34. big apple

  35. <i>big</i> <b>apple</b>

  36. <i>big</i> <b>apple</b>

  37. <i>big</i> <b>apple</b> Operation 1.  insertStartTag “i” 2.  insertCharacter “b” 3. 

    insertCharacter “i” 4.  insertCharacter “g” 5.  insertEndTag “i” 6.  insertCharacter “ ” 7.  insertStartTag “b” 8.  insertCharacter “a” 9.  insertCharacter “p” 10.  insertCharacter “p” 11.  insertCharacter “l” 12.  insertCharacter “e” 13.  insertEndTag “b”

  38. a big word a big word CLIENT A CLIENT B

  39. a <b>big</b> word Operation A 1.  retain 2 2.  insertStartTag

    “b” 3.  retain 3 4.  insertEndTag “b” a biiiiig word Operation B 1.  retain 3 2.  insertCharacters “iiii” CLIENT A CLIENT B

  40. a <b>big</b> word Operation B` 1.  retain 4 2.  insertCharacters

    “iiii” a biiiiig word Operation A` 1.  retain 2 2.  insertStartTag “b” 3.  retain 5 4.  insertEndTag “b” CLIENT A CLIENT B

  41. a <b>biiiiig</b> word Operation B` 1.  retain 4 2.  insertCharacters

    “iiii” a <b>biiiiig</b> word Operation A` 1.  retain 2 2.  insertStartTag “b” 3.  retain 5 4.  insertEndTag “b” CLIENT A CLIENT B

  42. Preserving Intent

  43. CLIENT A CLIENT B Desired Word1 Word2 Word3 <ol> <li>

    Word4 Word5 Word6 </li> </ol> <ol> <li> Word1 Word2 Word3 Word4 </li> </ol> Word5 Word6 <ol> <li> Word1 Word2 Word3 Word4 Word5 Word6 </li> </ol>

  44. CLIENT A CLIENT B Desired Word1 Word2 <p> Word3 Word4

    Word5 Word6 </p> <h1> Word1 Word2 Word3 Word4 </h1> Word5 Word6 <h1> Word1 Word2 </h1> <p> Word3 Word4 </p> <p> Word5 Word6 </p>

  45. CLIENT A CLIENT B Desired Word1 Word2 Word3 <i> Word4

    Word5 Word6 Word7 Word8 </i> <b> Word1 Word2 Word3 Word4 Word5 </b> Word6 Word7 Word8 <b> Word1 Word2 Word3 </b> <bi> Word4 Word5 </bi> <i> Word6 Word7 Word8 </i>

  46. •  retain •  deleteCharacter •  deleteStartTag(tag, attrs) •  deleteEndTag() • 

    deleteEmptyTag() •  insertCharacter •  insertStartTag(tag, attrs) •  insertEndTag() •  insertEmptyTag() •  modifyAttrs(attrs) Deletion Phase Insertion Phase OPERATION ATOMS

  47. Containers like: preserve unlike: priority Blocks like: priority unlike: priority

    Styles like: preserve unlike: merge Inline <ul> <li> <ol> <blockquote> <p> <div> <h1> <h2> <h3> <pre> <b> <i> <span> <u> <s> “text” <br> DOCUMENT SCHEMA