Volt Volta Quo Quo Vadi Vadis? s? Erik Meijer Wes Dyer - PowerPoint PPT Presentation

Volt Volta Quo Quo Vadi Vadis? s?

Erik Meijer Wes Dyer Jeffrey van Gogh Bart de Smet Matthew Podwysocki

Fu Fundam damentally entally ch chan ange ge th the way e way yo you th think ink ab abou out t co coor ordin dinating ating an and d hat? What? orch or chestrating estrating as asyn ynchrono chronous us an and d eve event nt-based based pro rogramming ramming

Be Beca cause use th the e es esse senc nce e of of Clo loud, d, hy? Web, Web , Mo Mobi bile le is is Why? as asyn ynchrono chronous us co comp mputation utations s

By By sho showing wing th that at as asyn ynchrono chronous us an and d eve event-based based w? How? co comp mputation utations s ar are e ju just st push sh-based based co colle llect ctions ions

An And d yo you ha u have ve th the e chan ch ance ce to to win win so some me $$ $$$

Envir vironment onment 1 2 Progr gram am 2 1 Rea eactiv ctive Interact teractiv ive Program Environment in control in control

A co A conc ncrete rete co collection lection of of po poke ker r co coins ns enumerable observable collection collection implements interface interface

Enumerable collections interface IEnumerable<out T> { IEnumerator<T> GetEnumerator() } interface IEnumerator<out T>: IDisposable { bool MoveNext() T Current{ get; } // throws Exception }

Enu numera merable ble co colle llection ction of ch f chips ips 1 GetEnumerator() 2 MoveNext() Consumer Current pu pull lls successive 3 true/false elements from The collection

Ob Obse servabl rvable e co colle llection ction of ch f chips ps 1 Subscribe 2 OnNext 3 Producer OnCompleted() pushe pu hes successive elements from The collection

Dua uality lity in n Mat ath h an and Eng ngineer ineering ing !(p||q) == (!p)&&(!q) !(p&&q) == (!p)||(!q)

Dua uality lity in n Mat ath h an and Eng ngineering ineering 1/R = 1/ R 1 +…+1/ R n R = R 1 +…+ R n 1/C = 1/ C 1 +…+1/ C n C = C 1 +…+ C n

Dua uality lity in n Mat ath h an and Eng ngineering ineering

Dualize Enumerable collections interface IEnumerable<out T> { IEnumerator<T> GetEnumerator() } interface IObservable<out T> { IDisposable Subscribe(IObserver<T> o) }

Dualize Enumerable collections interface IEnumerator<out T> { bool MoveNext() // throws Exception T Current{ get; } } interface IObserver<in T> { void OnCompleted(bool done) T OnNext{ set; } void OnError(Exception e) }

Observable collections interface IObservable<out T> { IDisposable Subscribe(IObserver<T> o) } interface IObserver<in T> { void OnDone(bool done) T OnNext{ set; } void OnError(Exception e) }

Observable collections interface IObservable<out T> { IDisposable Subscribe(IObserver<T> o) } interface IObserver<in T> { void OnCompleted() void OnNext(T value) void OnError(Exception e) }

Iterator intimately related Subject Observer

Ja Java a It Iterable rable & It & Itera erator tor Observ Ob ervable able/Observer /Observer class Observable interface Iterable<T> { { void addObserver(Observer o); Iterator<T> iterator() void deleteObserver(Observer o); void deleteObservers(); int countObservers(); void notifyObservers(); void notifyObservers(Object arg); void setChanged(); void clearChanged(); boolean hasChanged(); } } public interface Observer interface Iterator<T> { { void update(Observable o, Object arg); T next() // throws NoSuchElementException boolean hasNext() void remove() } }

IEnume umerab rable/ le/IEn IEnume umerat rator or pro roto toty typical pical inte terf rface ace for r inte teractiv ractive e colle lectio ctions ns and inte teractiv ractive e pro rogra rams ms er IObserv servable able/IOb /IObserv server pro roto toty typical pical inte terf rface ace for r ob obse serv rvable able co colle lections ctions an and d re reactiv tive, e, asynch nchro ronou nous s & & ev even ent-ba based sed pro rogra rams ms

Bu Buy y en enumera umerable ble co coll llection ections ge get t ob observa servable ble co coll llections ections for or fre ree! e! Both Bo th co collection llection in inte terfaces rfaces su supp pport ort th the e LI LINQ NQ St Standar andard d Qu Quer ery y Oper perators ators

Sa Samp mples les Drag and Drop Dictionary Suggest (AJAX programming using LINQ queries ) Clock (MVC programming using LINQ queries ) Twitter on Bing maps Animation

Combines event Di Dict ctionary onary Sug Suggest gest in n stream from UI with async C# C# call across network Html Format(this string [] entries) {…} [RunAtOrigin()] IObservable<string[]> Suggest (this Dictionary dict, string prefix, int count) {…} var inputValues = from i in Input.GetKeyUp() select i.Value; var q = from s in inputValues from r in Dictionary.Suggest(s, 10) select r.Format(); q.Subscribe(html => { output.InnerHtml = html; });

r ra ray ⊑ r ray ra ⊒

Pree eemp mption tion ope perator ator (Este stere relle) lle) var q = from s in inputValues from r in Dictionary.Suggest(s, 10) select r.Format(); var q = inputValues.Throttle(500). Publish(_inputValues => from s in _inputValues from r in Dictionary.Suggest(s, 10) .TakeUntil(_inputValues) select r.Format());

In Ja In JavaS aScript cript var input = document.getElementById("input"); var results = document.getElementById("results"); var changed = Rx.Observable.FromHtmlEvent(input, "keyup") .Select(function(){ return input.value }) .Where(function(value){ return value != ""; });

Switch Sw itch ins nste tead ad of Que f Query ry Sy Synt ntax ax changed.Throttle(250) .Select(function(what) { return query(what); }) .Switch() .Select(function(results) { return formatAsHtml(results); }) .Subscribe(function(html) { results.innerHTML = html; }, function(error){ results.innerHTML = "&gt;error retrieving results&lt;"; });

Twitte itter r on Bi n Bing ngMa Maps ps

JQ JQue uery ry Bindi nding ng jQuery.fn.ToObservable = function(eventType, eventData) { return Rx.Observable .FromJQuery(this, eventType, eventData); } Rx.Observable.FromJQueryEvent(someJQueryObject, “mousemove”)  someJQueryObject.ToObservable(“mousemove”) Array.prototype.toObservable = function() { return Rx.Observable.FromArray(this); };

Same pa Sa patter tern n as as di dictionary ctionary sug ugge gest st Rx.Observable.Interval(10000) .Select(function() { return searchTwitter("#mix10"); }) .Switch() .Select(function(result) { return JSON.parse(result.responseText); }) .SelectMany(function(data) { return data.results.toObservable(); }) .Where(function(data) { return data.geo != null; }) .Subscribe( function(data) { var lat = data.geo.coordinates[0]; var lon = data.geo.coordinates[1]; addPushPin(map, data.id, data.created_at, lat, lon, data.profile_image_url, data.from_user, data.text); }, function(error) { alert(error); }); });

Drag ag & Dr Drop p On On Wind ndow ows s Phone hone 7 dX dY

The e code e … var W = … control to be dragged …; var mouseDowns = from md in W.GetMouseDown() select true; var mouseUps = from mu in W.GetMouseUp() select false; var mouseClicks = mouseDowns.Merge(mouseUps); var mouseMoves = from mm in W.GetMouseMove() select new{ mm.X, mm.Y }; var mouseDiffs = from diff in mouseMoves.Skip(1).Zip(mouseMoves) select new { dX = diff.First.X – diff.Second.X , dY = diff.First.Y – diff.Second.Y }; var mouseDrag = from leftdown in mouseClicks from delta in mouseDiffs where leftdown select delta; mouseDrag.Subscribe(delta => { … move W by delta … });

Si Side de-Effects Effects var mouseDiffs = from diff in mouseMoves.Skip(1).Zip(mouseMoves) select new { dX = diff.First.X – diff.Second.X , dY = diff.First.Y – diff.Second.Y }; var mouseDiffs = mouseMoves.Let(_mousemoves => from diff in _mouseMoves.Skip(1).Zip(_mouseMoves) select new { dX = diff.First.X – diff.Second.X , dY = diff.First.Y – diff.Second.Y });

MVC MVC IObserver IObservable Model del View ew

function startClock() { var timeModel = getTime(); var analogView = getAnalogClock(); timeModel.Subscribe(analogView); }

Th The Mod e Model el function getTime() { return Rx.Observable.Interval(100) .Select(function() { var date = new Date(); var result = { hours : date.getHours(), minutes : date.getMinutes(), seconds : date.getSeconds(), }; return result; }); }