I've struggled to grok FRP in the past - I hear lots of smart people trumpeting it, but I haven't been able to wrap my head around it. This tutorial was great and I was following along right until it got to the part about modeling the suggestions as streams (<a href="https://gist.github.com/staltz/868e7e9bc2a7b8c1f754#modelling-the-3-suggestions-with-streams" rel="nofollow">https://gist.github.com/staltz/868e7e9bc2a7b8c1f754#modellin...</a>).<p>That was where everything went haywire for me - my brain doesn't want to think about those UI elements as streams and I instantly tune out and think "this doesn't make sense". I'm curious if anyone else also got stuck at that same part, as well as if anyone has suggestions/ideas for breaking past this mental barrier? Is there a different way of solving the same problem (that might make more sense to me)?
I thought this was a decent tutorial, but I'm a bit annoyed at the double-click bit. Yeah sure, you can implement some form of double-clicks in 4 lines of code, but it <i>behaves badly</i>. And since the tutorial glossed over it, I have no idea if this is just because the author doesn't realize they implemented a really bad click system, or because it takes a lot more than 4 lines of code to do it right and the author didn't like that so chose to ignore it.<p>Notably, the single-click stream has a built-in 250ms delay before the click is fired. That's bad. Similarly, the double-click has a built-in 250ms delay even if the user clicks twice within 100ms. In fact, it's not just a 250ms delay from the first click; it's a 250ms delay from the <i>last</i> click before it finally emits the event.<p>That's a completely unusable way of doing clicks. If that's how you do clicks in FRP, then that's a serious issue with FRP. I have to assume there's a better way, and I'd really like to see it.<p>The correct behavior is to emit a click event <i>immediately</i> upon a click, but to remember recent history and associate a click count with the event based on whether there are recent clicks. So if I click 7 times in a row at sufficient speed, I should get a click event for every single one, getting 1x through 6x clicks before finally getting the 7x click on the last one.
I am writing a game engine in Scheme that uses FRP. My implementation may not be robust since I'm the only user, but perhaps seeing what it can do will help someone. My implementation was heavily inspired by Elm.<p>Blog post with screencast to demonstrate:<p><a href="http://dthompson.us/functional-reactive-programming-in-scheme-with-guile-2d.html" rel="nofollow">http://dthompson.us/functional-reactive-programming-in-schem...</a><p>Implementation details:<p><a href="https://gitorious.org/sly/sly/source/8cf0096791821c7711c9dc2431e4d920f0b678ba:sly/signal.scm" rel="nofollow">https://gitorious.org/sly/sly/source/8cf0096791821c7711c9dc2...</a><p>2048 clone written in a reactive style:<p><a href="https://gitorious.org/sly/sly/source/8cf0096791821c7711c9dc2431e4d920f0b678ba:examples/2048/2048" rel="nofollow">https://gitorious.org/sly/sly/source/8cf0096791821c7711c9dc2...</a><p>Reading the explanation from the Elm folks is what made things click for me:<p><a href="http://elm-lang.org/learn/What-is-FRP.elm" rel="nofollow">http://elm-lang.org/learn/What-is-FRP.elm</a><p>Edit: Also, SICP has 2 sections that describe systems that are reminiscent of reactive programming systems.<p>A Simulator for Digital Circuits:<p><a href="https://mitpress.mit.edu/sicp/full-text/book/book-Z-H-22.html#%_sec_3.3.4" rel="nofollow">https://mitpress.mit.edu/sicp/full-text/book/book-Z-H-22.htm...</a><p>Propagation of Constraints:<p><a href="https://mitpress.mit.edu/sicp/full-text/book/book-Z-H-22.html#%_sec_3.3.5" rel="nofollow">https://mitpress.mit.edu/sicp/full-text/book/book-Z-H-22.htm...</a>
A lot of people have reported that they grok Rx* much better once they watch this talk I gave at <a href="http://vimeo.com/43659034" rel="nofollow">http://vimeo.com/43659034</a> - if you understand map / reduce / filter as applied to lists (in C#, "Select / Aggregate / Where"), Reactive Programming isn't too hard to understand if properly explained.
Names can change over time but here is how i recall it:<p>FRP is a development based on the work of conal elliott:
<a href="http://conal.net/" rel="nofollow">http://conal.net/</a>
It's main characteristic is that there is a continuous (pull)aspect. Since many interesting domains are not predominantly continuous he and many others had to add a discrete event based component.<p>Rx is a stream based technology (push). Basically it is a dataflow library with modern functional programming syntactic elements. It does not have a continuous aspect and as such it is not FRP.<p>By treating Rx as something new we are depriving our self of the dataflow and structured programming knowledge.
Here's an introduction to Bacon.js, implementing a game with eventstreams, if anyone is interested in more.<p><a href="http://philipnilsson.github.io/badness/" rel="nofollow">http://philipnilsson.github.io/badness/</a>
This is super helpful. The example with the multi-click stream is pretty impressive as a demo. Is anyone familiar with the Elm[1] language/library that compiles to JS? Does it facilitate good FRP practice? Or are there any better libraries/languages out there? I've just seen a lot of Elm when I've google FRP in the past. (Followed closely by Haskell.)<p>[1] <a href="http://elm-lang.org/" rel="nofollow">http://elm-lang.org/</a>
With seemingly more emphasis being placed on complex pub-sub architectures, has there been any equivalent development of tooling to assist in visualizing/grokking an existing pub-sub application? In my experience at least, pub-sub architecture can be difficult to follow without good tooling (trying to keep all of these coexisting streams in your head when making changes, as asynchronous code is difficult to write a test suite for that could catch mistakes). This is somewhat just the nature of asynchronous programming, but there has been more and more emphasis on that as well with the popularity of highly responsive GUI applications and more computing capacity for background tasks.<p>Aside from using Visual Studio-esque "find references" to navigate to all of the locations in a codebase where a particular event stream is subscribed to, I've yet to come across much.
It looks to me like Bacon.js is the community favorite and RxJS is the corporate framework when it comes to JavaScript libraries for FRP. I'm thinking about introducing an FRP library into the frontend stack where I work — does anyone have any experience with using either of these libraries (or another) for corporate work? What did you use and how did your coworkers deal with it?
I also found Martin Odersky's Principles of Reactive Programming Coursera class [1] very helpful.<p>[1] <a href="https://class.coursera.org/reactive-001" rel="nofollow">https://class.coursera.org/reactive-001</a>
Great article but there's something I'd like to understand: the article talks about FRP yet writes <i>"(Functional) Reactive Programming"</i> with "functional" between parentheses, why?<p>Is the 'F' in FRP the same 'F' as when people say that, for example, Haskell and Clojure are FP languages?<p>Does FRP use the notion of "functions" which are closer to the mathematical definition of a function? For example does FRP try to avoid state and mutable data as much as possible and do the same inputs always lead to the same output? Or is it called "functional" simply because it allows to use things like map/reduce/filter?<p>If it is "really" functional, I take it it's quite deterministic: can you then take all these streams of events and "replay" them at will, always ending up in the same intermediary state and, eventually, in the same final "state"?<p>If that's the case, then it's the next thing on my "to learn" list :)
Some additional overview of different reactive approaches:<p><a href="http://www.slideshare.net/deanwampler/reactive-design-languages-and-paradigms" rel="nofollow">http://www.slideshare.net/deanwampler/reactive-design-langua...</a>
<a href="https://www.youtube.com/watch?v=4L3cYhfSUZs" rel="nofollow">https://www.youtube.com/watch?v=4L3cYhfSUZs</a><p>* responsive (somewhat hand-wavy - basically, don't block on IO)<p>* scalable (hard to be scalable - many different approaches)<p>* resilient (hard to be resilient - erlang is king here)<p>* event-driven (it's hard to not be event-driven these days)
We use ReactiveCocoa [0] extensively at work and can't recommend it highly enough [1]. (Although admittedly KVO makes Cocoa almost the ideal platform for reactive programming.)<p>[0]: <a href="https://github.com/ReactiveCocoa/ReactiveCocoa" rel="nofollow">https://github.com/ReactiveCocoa/ReactiveCocoa</a>
[1]: <a href="http://ianthehenry.com/2014/5/4/kvo-101/" rel="nofollow">http://ianthehenry.com/2014/5/4/kvo-101/</a>
If you're interested in FRP in terms of GUI programming, as described in the linked article, you should definitely checkout ReactFX [0], an FRP library for JavaFX, and also the author Tomas Mikula's blog [1] that contains very convincing examples of FRP's usefulness for real UI tasks [2].<p>[0]: <a href="https://github.com/TomasMikula/ReactFX" rel="nofollow">https://github.com/TomasMikula/ReactFX</a><p>[1]: <a href="http://tomasmikula.github.io/blog/" rel="nofollow">http://tomasmikula.github.io/blog/</a><p>[2]: <a href="http://tomasmikula.github.io/blog/2014/04/25/combining-reactfx-and-asynchronous-processing.html" rel="nofollow">http://tomasmikula.github.io/blog/2014/04/25/combining-react...</a><p>If you are confused by the term FRP and its different interpretations, I tried to summarize them in a stackoverflow answer: <a href="http://stackoverflow.com/questions/22795062/is-it-possible-to-translate-the-mario-example-from-elm-to-either-pure-javafx-or/23909098#23909098" rel="nofollow">http://stackoverflow.com/questions/22795062/is-it-possible-t...</a>
> FRP streams go beyond promises by allowing many returned values. This is pretty nice, and shows how FRP is at least as powerful as Promises.<p>The fact that you can only return a single value from a promise is a feature, not a limitation. In synchronous code, you can only return once from a function. In asynchronous promise code, you can only fulfill the promise once. There's a parallel.<p>If you want to "allow many returned values" you can just use a callback. You hardly need a "stream" for that.
For those searching for Rx examples, I found these:<p><a href="https://github.com/fdecampredon/react-rxjs-todomvc" rel="nofollow">https://github.com/fdecampredon/react-rxjs-todomvc</a> (TodoMVC implementation built on top of React + RxJS)<p><a href="https://github.com/eliseumds/react-autocomplete" rel="nofollow">https://github.com/eliseumds/react-autocomplete</a> (React + RxJS Autocomplete)
If you want to learn streams the hard way try to implement any non trivial build process with gulp.js<p>Just a warrning. Node.js had 3 versions of streams so far and some packages that implement stream functionality don't all work properly with latest version. Also two types bytestream and object stream.
To add another resource to the list, I gave an introductory talk to bacon.js and FRP last year which has similar diagrams to these which I animated with d3 if anyone'a interested: <a href="http://vimeo.com/m/68987289" rel="nofollow">http://vimeo.com/m/68987289</a>
I wrote a little FRP library in Ruby: <a href="https://github.com/steveklabnik/frappuccino" rel="nofollow">https://github.com/steveklabnik/frappuccino</a>
RxJava's wiki is also pretty good: <a href="https://github.com/Netflix/RxJava/wiki" rel="nofollow">https://github.com/Netflix/RxJava/wiki</a>
How is this different from complex event processing (CEP)? High frequency trading has been using this from day 1.<p>The real trick is working with historical events and fetch them from disk, otherwise your reasoning time window is restricted to whatever fits in RAM.
There is one thing that really bothers me, I've not found a single a mathematical formula that defines FRP. The closest thing I've found was the "Denotational Semantics" showing the logic behind, which is quite lenghty and leaves a lot of room for variations. I hate descriptions full of buzzwords that, when you look at it closely have really nothing to do with FRP, but are mere tools that help realizing it.<p>Is there someone who can explain us scholars how FRP can be noted down formaly? Even a link to a page of a paper that shows the formula would be enormously useful. I'll put all the good papers that I've found in the footnoes.<p>--------
<i>The following are a few of the good papers on FRP (ordered by subj. quality). I've read the Elm paper, but it's vague despite having a lot of maths in it. What it really decribes is not FRP, but Elm (also it's not exactly FRP).</i><p> [1] <a href="https://blogs.janestreet.com/breaking-down-frp/" rel="nofollow">https://blogs.janestreet.com/breaking-down-frp/</a>
[2] Higher-Order Functional Reactive Programming without Spacetime Leaks - <a href="https://www.mpi-sws.org/~neelk/simple-frp.pdf" rel="nofollow">https://www.mpi-sws.org/~neelk/simple-frp.pdf</a>
[3] An Axiomatic Semantics for Functional Reactive Programming - <a href="http://www.wpi.edu/Pubs/ETD/Available/etd-042908-133033/unrestricted/cking.pdf" rel="nofollow">http://www.wpi.edu/Pubs/ETD/Available/etd-042908-133033/unre...</a>
[4] Push-pull functional reactive programming - <a href="http://conal.net/papers/push-pull-frp/" rel="nofollow">http://conal.net/papers/push-pull-frp/</a>
[5] Categorical Semantics for Functional Reactive Programming with Temporal Recursion and Corecursion - <a href="http://www.cs.bham.ac.uk/~pbl/msfp2014/catsemfrp.pdf" rel="nofollow">http://www.cs.bham.ac.uk/~pbl/msfp2014/catsemfrp.pdf</a>
[6] Completeness of Conversion between Reactive Programs for Ultrametric Models - <a href="http://www.cs.le.ac.uk/people/fdv1/fdv1/Distribution/SeveriDeVriesTLCA2013.pdf" rel="nofollow">http://www.cs.le.ac.uk/people/fdv1/fdv1/Distribution/SeveriD...</a>
[7] Fair Reactive Programming - <a href="http://www.cs.mcgill.ca/~acave1/papers/fair-reactive.pdf" rel="nofollow">http://www.cs.mcgill.ca/~acave1/papers/fair-reactive.pdf</a>
[8] A Survey on Reactive Programming - <a href="http://soft.vub.ac.be/Publications/2012/vub-soft-tr-12-13.pdf" rel="nofollow">http://soft.vub.ac.be/Publications/2012/vub-soft-tr-12-13.pd...</a>
[9] Signals, Not Generators! - <a href="http://www.ioc.ee/~wolfgang/research/tfp-2009-slides.pdf" rel="nofollow">http://www.ioc.ee/~wolfgang/research/tfp-2009-slides.pdf</a>
[10] <a href="http://stackoverflow.com/questions/5875929/specification-for-a-functional-reactive-programming-language#5878525" rel="nofollow">http://stackoverflow.com/questions/5875929/specification-for...</a>
[11] <a href="http://stackoverflow.com/questions/1028250/what-is-functional-reactive-programming/1030631#1030631" rel="nofollow">http://stackoverflow.com/questions/1028250/what-is-functiona...</a><p><i>The bad thing about all those papers is that a) you need to know Category Theory, b) Temporal Logic, c) Denotational Semantics d) (and optionally Henkin and Ultrametric Models) Unfortunately I'm not yet that smart :( hope someone can bring clarity into FRP</i><p>Sorry for the ugly footnote, that's the best I got using HN's formatting capability.<p>Update: I used unicode spaces, that fixed it.
"Javascript is the most familiar language out there at the moment"<p>Will people ever stop using this reasoning? Why not pick the best/better language instead?
> So you're curious in learning this new thing called (Functional) Reactive Programming (FRP).<p>Chaining is the new goto. Abused, it causes deeply anti-modular, temporally coupled code, which is really really ugly to maintain (good thing rockstar ninja programmers only need to think two weeks ahead).