This document discusses functional reactive programming (FRP) and how it can help solve problems related to consistency, entropy, responsiveness, and abstraction in user interfaces. It explains key concepts of FRP like programming with streams/observables, declarative representation of changing values over time, and minimizing mutation. It also outlines some of the benefits of FRP like separation of concerns between data emitters and subscribers. Finally, it acknowledges some challenges of FRP like learning curve, commitment to the architecture, and recommends resources to learn more.

1. Functional Reactive
Programming.
What does it solve?
Does it solve
things? Let’s find
out!

2. Netta Bondy
Senior FE Engineer @ Tikal
@_bondit_
https://medium.com/@NettaB

4. What is Reactive Programming?
Programming with Streams (Observables)

5. What is So Great about Reactive
Programming?
● Declerative representation of values changing over time
● Minimise Mutation
● Separation of concerns - emitters vs. subscribers

6. What is
Functional
Reactive
Programming?
● Mobx → includes
observables
● Rx → includes
observables and
opeartors

7. Reactive Programming

8. Functional-Reactive Programming
O
O
O
O
O O

10. The Problems
https://overreacted.io/the-elements-of-ui-engineering/

11. - Consistency
- Entropy
- Responsiveness
- Abstraction
The Problems

12. Consistency
click
!isLiked
isLikedmap

13. Consistency
isLiked
POST
map
response
comp compcomp

16. mergeMap
O O

17. switchMap
O O

18. Entropy - Consecutive Requests
isLiked
POST
switchMap
response
comp compcomp

19. Responsiveness - Optimistic Updates
isLiked
POSTswitchMap
response
comp compcomp
merge

20. Abstraction
isLiked
POSTswitchMap
response
comp compcomp
merge

21. The price
● Learning curve
● Commitment
● Architecture

23. Resources:
● This StackOverflow discussion, and particularly this answer
by Conal Elliot
● This excellent practical guide by Andres Staltz
● The documentation of Rx (not RxJS)
● A sample app built in FRP

24. Thank you
@_bondit_