swarm.js: реактивная синхронизация данных — Виктор...
Embed Size (px)
DESCRIPTION
Такие продвинутые возможности приложения, как обновление данных в реальном времени, совместная работа, оффлайн, кэширование и handover/continuity упираются в одну проблему — синхронизацию реплик данных. Наша смелая мечта — писать такие распределённые приложения, как простое MVC, работая лишь с локальной репликой модели и делегировав синхронизацию специальному middleware. В докладе я расскажу, что такое CRDT и как библиотека Swarm.js позволяет строить реактивные архитектуры, реализующие все эти возможности (с демонстрацией).TRANSCRIPT
- SWARM @ MOSCOWJS , 17 2014
- 1 2 3 4 5 atom a1 (Alice's rst) weft: a4 weft: a4b2 weft: a5b2 atom offsets within yarns yarn "a" Alice yarn "0" special yarn "b" Bob x T e s t causality relation: a5 is caused by b2 3.3 Ordering of siblings a b a b a b a b a b a b c c c a b ( ) > ( ) ct Citrea and Swarm: partially ordered op logs in the browser Victor Grishchenko Citrea LLC [email protected] 25 March 2014 Abstract Principles of eventual consistency are normally applied in large- scale distributed systems. I report experiences applying EC in Web app development. Citrea is a collaborative rich text editor employing the Causal Trees[4] technology of concurrency/version control (note: CT is not an OT avor). CT employs symbol ids and trees and, gener- ally, belongs to the same family as WOOT, Logoot or Treedoc [1, 3, 2]. CT makes the ids-and-trees approach production-practical by limiting itself to simple and lightweight algorithms and data structures. Swarm is a JavaScript object sync library that works in the browser, in real time. Swarm fully employs client-side storage and works well under in- termittent connectivity. Swarm employs pure op-based model. Our
- CAP
- CRDT Convergent Commutative Cloud Replicated Data Types A CRDT is a data type whose operations commute when they are concurrent. Replicas of a CRDT eventually converge without any complex concurrency control.
- CRDT 11: Is value1 value2 in semilattice? 12: merge (value1, value2) : payload mergedValue 13: LUB merge of value1 and value2, at any replica M mergemerge M g(x2) S S source f(x1) x3 x1 x2 x merge M Figure 4: State-based replication 0 1 4 14 4 4 4 4 M maxmax M x2 := 4 G+A G+A x1 := 1 x3 x1 x2 x max M0 0 0 4 4 4 4 4 Figure 5: Example CvRDT: integer + max
- SWARM
- SWARM: M OF MVC
- SWARM (CODE) var host = new Swarm.Host('user~ssn'); ! host.connect(ws://localhost:8000'); ! var mickey = host.get(/Mouse#Mickey, function(s,v,o){ mickey.set({ x:100, y:100 }); });
- SWARM + REACT var SwarmMixin = { deliver: function (spec,val,source) { this.isMounted() && this.forceUpdate(); }, componentWillMount: function () { var spec = this.props.spec; this.sync = app.host.get(spec); this.sync.on('.init',this); this.sync.on(this); }, componentWillUnmount: function () { this.sync.off(this); } }; React.renderComponent( MouseTrackApp ({spec:/Mouse#Mickey}), document.getElementById('mice-container') ); get by spec on/off
- http://swarmjs.github.io http://github.com/gritzko/swarm @gritzko @swarm_js [email protected]