at Progscon - London - 22/04/2016

by @doppioslash

Elm:

Finding the Functional in

Reactive Programming 

What is Functional Reactive Programming?

What is Functional Reactive Programming?

Good question!

What is Functional Reactive Programming?

It's a bit like the Boggart Wardrobe 

Can't be sure what will come out

What is Functional Reactive Programming?

Jokes aside...

There are many version of FRP, with different implementation trade-offs

The FRP "specs" (denotational semantics) are in PL Theory Terms

What is Functional Reactive Programming?

At least 3 points of view today:

Elm's

Conal's

(the original)

Reactive

Programming's

What is Functional Reactive Programming?

Conal Elliot defined FRP back in 1998, in his paper

"Functional Reactive Animation"

and has kept working on it since then

Official FRP

can be combined with OOP/Imperative/FP

is paradigm on its own

What is Functional Reactive Programming?

Reactive Programming

Let's start from RP and get to FRP by fixing RP's problems

What is Functional Reactive Programming?

What is Reactive Programming

What is Reactive Programming

Typical problem that can benefit from RP:

You need to change <something>,

or multiple somethings

when

a button is pressed/

a variable changed/

an event happens/

etc

- Listener

- Observer

- Callback

- ...

What is Reactive Programming

How to do that?

Many names for the same underlying concept

What is Reactive Programming

What is Reactive Programming

Did you deregister your listener?

...or it will go on listening forever.

What is Reactive Programming

Problems

1. Unpredictable order

2. Missed first event

3. Callbacks pyramids

4. Threading issues

5. Leaking Callbacks

6. Accidental Recursion

Ref: FRP Manning book

(depends on listener ordering)

(initialisation order problem)

What is Reactive Programming

When your program is mainly

event-based

a control-flow based paradigm litters observer code everywhere

Examples: Games, UIs

What is Reactive Programming

Your variables/events are better described as Signals

http://yang-wei.github.io/elmflux/

What is Reactive Programming

You're explicitely describing the dependencies and not control flow

What you really care about are your events and variables changes, not the control flow

from one-by-one callback/listeners to dependency graph

A matter of perspective...

imperative perspective : explicit ordering

reactive perspective : explicit dependencies

What is Reactive Programming

imperative perspective : sequence

reactive perspective : dependency

What is Reactive Programming

Signals (aka Cells, Events, Behaviour)

• a different way of thinking about variables
• an explicit model of variable mutation in time

What is Reactive Programming

Signals Transformation

• Filter

• Merge

• Apply

What is Reactive Programming

1.  init, build the graph
2. run data through the graph

Running

instead of your custom control flow

What is Reactive Programming

What about those problems?

1. Unpredictable order

2. Missed first event

3. Callbacks pyramids

4. Threading issues (a bit)

5. Leaking Callbacks

6. Accidental Recursion

What is Reactive Programming

An Implementation:

"Rx = Observables + LINQ + Schedulers"

What is Reactive Programming

What does RP lack compared to FRP?

To Functional Reactive Programming

To Functional Reactive Programming

• compositionality
• immutability guarantees
• inherently parallelisable

FRP adds to RP:

To Functional Reactive Programming

Referential Transparency

a function when it gets the same inputs, will always return the same output.

To Functional Reactive Programming

What breaks Referential Transparency?

• I/O
• throw any exceptions handled outside of the function
• reading the value of any mutable external variable

• mutate any externally visible state
• keeping state around between invocations of the function

To Functional Reactive Programming

What breaks Referential Transparency?

Basically no Side Effects allowed:

• must not influenced by anything outside the function
• only effect on the outside is the return value

To Functional Reactive Programming

Immutability

Signals are a way to express mutability in a controlled way

Any shared mutable state makes the program harder to parallelise

Compositionality

The property that the meaning of an expression is determined by the meanings of its parts and the rules used to combine them.

Yes, I know.

To Functional Reactive Programming

Compositionality

Being able to compose functions:

add : Int -> Int
add n1 = n1 + 2

mult : Int -> Int
mult n1 = n1 * 2

composedFunction = 
  add >> multiply
> composedFunction 4 
12 : number

Let's try again...

To Functional Reactive Programming

In practice...

To Functional Reactive Programming

Let's look at Elm's implementation

What is Elm

(and why you should use it)

What is Elm

Purely Functional

(Referential Transparency & Immutability)

Eager Evaluation

(not lazy like Haskell)

Static Type System

(similar to Haskell)

What is Elm

Compiles to fast Javascript, HTML, CSS

Interoperates with Javascript while still being type safe

Small

What is Elm

Invented by Evan Czaplicki for his thesis

Meant to be approachable and practical

No 'scary' terms like Monad

What is Elm

In production at:

Practical Elm + Examples

Type signatures

add : Int -> Int

Is the signature of a function that takes an Integer and returns an Integer.

add : Int -> Int -> Int

Is the signature of a function that takes two Integers and returns an Integer.

Practical Elm + Examples

Currying

If you partially apply a function, by giving it less arguments than it takes, it will return a function that takes the remaining args: 

add : Int -> Int -> Int

add n1 n2 = n1 + n2

> addTen = add 10
​<function> : Int -> Int
> addTen 1
11 : number

Practical Elm + Examples

Main function

The main function is the entry point of program execution, so you need one, or your code won't run.

It is wired to one or more Signals that drive the whole application.

Practical Elm + Examples

Way to Elm

Way to Elm

Getting used to the Functional Programming way of doing things: 

• currying
• destructuring
• pattern matching
• expressive types

• no loops, rather mapping and folding

• only mutate indirectly in fold (by returning value)

   

Getting used to FRP way of doing things:

• most variables are signals
• no direct control flow
• define the graph
• type system + TEA makes things converge

Way to Elm

Conclusion

FRP:

• can help you contain complexity

• can give you better debugging tools

• is already used in production (Elm)

References

Find them at:

lambdacat.com/progscon-elm-finding-the-functional-in-reactive-programming

That's all folks!

@doppioslash

@doppioslash

See you on twitter :)