响应式编程及框架

  • 2,841 views
Uploaded on

Largely inspired by (and stealed from) Erik's talk at Mix10.

Largely inspired by (and stealed from) Erik's talk at Mix10.

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
2,841
On Slideshare
0
From Embeds
0
Number of Embeds
3

Actions

Shares
Downloads
80
Comments
0
Likes
7

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. Reactive Programming and Framework Zhao Jie - SNDA - Sep. 2010
  • 2. About me / / Jeffrey Zhao / Blog: http://blog.zhaojie.me/ Twitter: @jeffz_cn F#, Scala, JavaScript, Python, .NET, mono... Java (as the language) hater
  • 3. What? Fundamentally change the way you think about coordinating and orchestrating asynchronous and event-based programming
  • 4. Why? Because the essence of Cloud, Web, Mobile is asynchronous computations
  • 5. How? By showing that asynchronous and event-base computations are just push-based collections
  • 6. Interactive & Reactive
  • 7. a := b + c
  • 8. Interactive Reactive Environment Program
  • 9. Let’s implement both interfaces with...
  • 10. Enumerable Collections interface  IEnumerable<out  T> {        IEnumerator<T>  GetEnumerator(); } interface  IEnumerator<out  T> {        bool  MoveNext();        T  Current  {  get;  } }
  • 11. 1 Enumerator GetEnumerator() Current 3 2 MoveNext() Consumer pulls successive elements true/false from the collection
  • 12. Dualize Enumerable Collections interface  IEnumerable<out  T> {        //  void  -­‐>  enumerator        IEnumerator<T>  GetEnumerator(); } interface  IObservable<out  T> {        //  observer  -­‐>  void        IDisposable  Subscribe(IObserver<T>  o) }
  • 13. Dualize Enumerable Collections interface  IEnumerator<out  T> {        bool  MoveNext();  //  void  -­‐>  bool        T  Current  {  get;  }  //  void  -­‐>  T        //  throws  Exception } interface  IObserver<in  T> {        void  OnCompleted(bool  done);  //  bool  -­‐>  void        T  Current  {  set;  }  //  T  -­‐>  void        void  OnError(Exception  ex);  //  accepts  Exception }
  • 14. Observable Collections interface  IObservable<out  T> {        IDisposable  Subscribe(IObserver<T>  o) } interface  IObserver<in  T> {        void  OnCompleted();        void  OnNext(T  item);        void  OnError(Exception  ex); }
  • 15. 1 Observer Subscribe(o) 2 OnNext(e) 3 OnCompleted() Producer pushes successive elements X from the collection
  • 16. IEnumerable & IEnumerator are prototypical interfaces for interactive collections and interactive programs. IObservable & IObserver are prototypical interfaces for observable collections and reactive, asynchronous & event-based programs.
  • 17. Iterator Observer
  • 18. Iterator / Observer Patterns in Java interface  Iterable<T>  { class  Observable  {        Iterator<T>  iterator();        void  addObserver(Observer  o); }        void  deleteObserver(Observer  o);        void  deleteObservers();        int  countObservers();        void  notifyObservers();        void  notifyObservers(Object  arg);        void  setChanged();        void  clearChanged();        boolean  hasChanged(); } interface  Iterator<T>  { interface  Observer  {        T  next();        void  update(Observable  o,  Object  arg); }        boolean  hasNext();        void  remove(); }
  • 19. LINQ to Observable
  • 20. LINQ to Observable If you are writing LINQ or declarative code in an interactive program...
  • 21. LINQ to Observable If you are writing LINQ or declarative code in an interactive program... You already know how to use it!
  • 22. ... the principle we go by is, don't expect to see a particular concurrency model put into C# because there're many different concurrency model ... it's more about finding things are common to to all kinds of concurrency ... - Anders Hejlsberg
  • 23. ... the principle we go by is, don't expect to see a particular concurrency model put into C# because there're many different concurrency model ... it's more about finding things are common to to all kinds of concurrency ... - Anders Hejlsberg
  • 24. LINQ to Object Standard query operators Select Where SelectMany ... Extended query operators Zip Aggregate ...
  • 25. LINQ to Observable Standard query operators Select Where SelectMany ... Extended query operators Zip Throttle ...
  • 26. How to move a ball by keyboard (ASDW)?
  • 27. Imperative Impl. void  OnKeyPress(object  sender,  KeyPressEventArgs  e) {        if  (isPlaying)        {                if  (e.KeyChar  ==  'a'  &&  ball.Left  >  0)                {                        ball.Left  -­‐=  5;                }                else  if  (e.KeyChar  ==  'w'  &&  ball.Top  >  0)                {                        ball.Top  -­‐=  5;                }                else  ...        }        else  ... }
  • 28. Declarative Impl. //  filter  the  KeyPress  events  when  playing var  keyPress  =  GetKeyPress().Where(_  =>  isPlaying); //  filter  the  events  to  move  left var  moveLeft  =  from  ev  in  keyPress                              where  ev.EventArgs.KeyChar  ==  'a'                              where  ball.Left  >  0                              select  ev; moveLeft.Subscribe(_  =>  ball.Left  -­‐=  5); //  filter  the  events  to  move  top var  moveTop  =  from  ev  in  keyPress                            where  ev.EventArgs.KeyChar  ==  'w'                            where  ball.Top  >  0                            select  ev; moveTop.Subscribe(_  =>  ball.Top  -­‐=  5);
  • 29. Mouse drag and draw
  • 30. var  mouseMove  =  GetMouseMove(); var  mouseDiff  =  mouseMove.Zip(mouseMove.Skip(1),        (prev,  curr)  =>  new        {                PrevPos  =  new  Point(                        prev.EventArgs.X,  prev.EventArgs.Y),                CurrPos  =  new  Point(                        curr.EventArgs.X,  curr.EventArgs.Y)        }); var  mouseDrag  =  from  _  in  GetMouseDown()                                from  diff  in  mouseDiff.TakeUntil(GetMouseUp())                                select  diff; mouseDrag.Subscribe(d  =>  DrawLine(d.PrevPos,  d.CurrPos));
  • 31. Everything in Web is Asynchronous User actions AJAX requests Animations ...
  • 32. Reactive Framework in JavaScript A full featured port for JavaScript Easy-to-use conversions from existing DOM, XmlHttpRequest, etc In a download size of less than 7kb (gzipped) Bindings for various libraries / frameworks jQuery MooTools Dojo ...
  • 33. Mouse drag and draw in JavaScript
  • 34. var  target  =  $("#paintPad"); var  mouseMove  =  target.toObservable("mousemove"); var  mouseDiff  =  mouseMove.Zip(mouseMove.Skip(1),          function(prev,  curr)  {                return  {                        prevPos:  {  x:  prev.clientX,  y:  prev.clientY  },                        currPos:  {  x:  curr.clientX,  y:  curr.clientY  }                };        }); var  mouseDown  =  target.toObservable("mousedown"); var  mouseUp  =  target.toObservable("mouseup"); var  mouseDrag  =  mouseDown.SelectMany(function()  {        mouseDiff.TakeUntil(mouseUp); }); mouseDrag.Subscribe(        function(d)  {  drawLine(d.prevPos,  d.currPos);  });
  • 35. Wikipedia lookup
  • 36. var  textBox  =  $("#searchInput"); var  searcher  =  textBox        .toObservable("keyup")        .Throttle(500)        .Select(function(_)  {  return  textBox.val();  })        .Select(function(term)  {  return  queryWikipedia(term);  })        .Switch(); searcher.Subscribe(        function(data)  {                var  results  =  $("#results");                results.empty();                $.each(data,  function(_,  value)  {                        results.append($("<li/>").text(value));                });        },        function(error)  {  $("#error").html(error);  });
  • 37. Time flies like an arrow
  • 38. var  container  =  $("#container"); var  mouseMove  =  container.toObservable("mousemove"); for  (var  i  =  0;  i  <  text.length;  i++)  {        (function(i)  {                var  ele  =  $("<span/>").text(text.charAt(i));                ele.css({position:  "absolute"}).appendTo(container);                mouseMove.Delay(i  *  100).Subscribe(function  (ev)  {                        ele.css({                                left:  ev.clientX  +  i  *  20  +  15  +  "px",                                top:  ev.clientY  +  "px"                        });                });        })(i);
  • 39. Benefits of Rx Easy to composite and coordinate async operations Easy to express the algorithm (code locality) Easy to be unit tested ...
  • 40. Rx & Language Features Features in C# that Rx uses Extension method Lambda expression & closure Type inference LINQ query expression Rx has been implemented in ... C# & VB JavaScript F#
  • 41. Port to other Languages Rx can be easily ported to various languages Scala Ruby Python modern languages with basic functional features Almost impossible to implement Rx in Java Cannot extend a type without breaking code Missing enough functional features
  • 42. Resources Matthew Podwysocki http://codebetter.com/blogs/matthew.podwysocki/ Reactive Framework on MSDN DevLabs http://msdn.microsoft.com/en-us/devlabs/ ee794896.aspx Tomáš Petříček http://tomasp.net/
  • 43. Q&A