Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Functional Reactive Programming
Search
Jason Orendorff
March 30, 2013
Programming
10
970
Functional Reactive Programming
Slides for a talk by Wilkes Joiner at Nashville Code Co-op Talk Day.
Jason Orendorff
March 30, 2013
Tweet
Share
More Decks by Jason Orendorff
See All by Jason Orendorff
Aristotle's Topics
jorendorff
0
120
Meltdown & Spectre
jorendorff
0
75
<textarea distributed>: An illustrated intro to CRDTs
jorendorff
0
50
Cabbages, Goat, and Wolf In Two Styles!!
jorendorff
0
50
John Wark — Design Principles for a High School Coding Curriculum
jorendorff
1
110
Teaching Programming
jorendorff
2
110
goto fail; — Challenges and Considerations for Teaching Programming to Kids
jorendorff
1
63
How To Fix Bugs
jorendorff
0
98
Compilers 101: An introduction to programming languages and parsing
jorendorff
3
770
Other Decks in Programming
See All in Programming
從零到一:搭建你的第一個 Observability 平台
blueswen
0
220
推論された型の移植性エラーTS2742に挑む
teamlab
PRO
0
150
Doma で目指す ORM 最適解
nakamura_to
1
160
Reactive Thinking with Signals, Resource API, and httpResource @Devm.io Angular 20 Launch Party
manfredsteyer
PRO
0
130
Devinで実践する!AIエージェントと協働する開発組織の作り方
masahiro_nishimi
6
2.6k
TypeScriptのmoduleオプションを改めて整理する
bicstone
4
430
「兵法」から見る質とスピード
ickx
0
200
テスト分析入門/Test Analysis Tutorial
goyoki
12
2.7k
Javaに鉄道指向プログラミング (Railway Oriented Pro gramming) のエッセンスを取り入れる/Bringing the Essence of Railway-Oriented Programming to Java
cocet33000
1
130
Cursor Meetup Tokyo ゲノミクスとCursor: 進化と制約のあいだ
koido
1
320
人には人それぞれのサービス層がある
shimabox
3
470
AIにコードを生成するコードを作らせて、再現性を担保しよう! / Let AI generate code to ensure reproducibility
yamachu
7
6.1k
Featured
See All Featured
Making Projects Easy
brettharned
116
6.2k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
Thoughts on Productivity
jonyablonski
69
4.7k
The Art of Programming - Codeland 2020
erikaheidi
54
13k
For a Future-Friendly Web
brad_frost
178
9.7k
Building Flexible Design Systems
yeseniaperezcruz
329
39k
The Language of Interfaces
destraynor
158
25k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
280
13k
Building Better People: How to give real-time feedback that sticks.
wjessup
368
19k
Done Done
chrislema
184
16k
The Power of CSS Pseudo Elements
geoffreycrofte
76
5.8k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
6
660
Transcript
Functional Reactive Programming
“Everything flows, nothing stands still.” Heraclitus
Streams of Events
Streams of Events • Fire and forget events are relatively
easy to create.
Streams of Events • Fire and forget events are relatively
easy to create. • UIs
Streams of Events • Fire and forget events are relatively
easy to create. • UIs • Ajax posts
Streams of Events • Fire and forget events are relatively
easy to create. • UIs • Ajax posts • Messaging queues
Processing Events
Processing Events • A little trickier
Processing Events • A little trickier • difficult to compose
Processing Events • A little trickier • difficult to compose
• lots of plumbing
Processing Events • A little trickier • difficult to compose
• lots of plumbing • Callback Hell
“We’re going to need a bigger boat.”
FRP • A model for values that vary over time
• Originates from Haskell Community • Several different implementation styles • We are focusing on Microsoft’s ReactiveExtenions style
Observable
Observable • A marriage of Iterables and the Observer Pattern
Observable • A marriage of Iterables and the Observer Pattern
• Typical Sequence functions - Map, Filter, Reduce, Take
Observable • A marriage of Iterables and the Observer Pattern
• Typical Sequence functions - Map, Filter, Reduce, Take • Subscribe/OnNext
Observable • A marriage of Iterables and the Observer Pattern
• Typical Sequence functions - Map, Filter, Reduce, Take • Subscribe/OnNext • Error Handling
Observable • A marriage of Iterables and the Observer Pattern
• Typical Sequence functions - Map, Filter, Reduce, Take • Subscribe/OnNext • Error Handling • Timing function - Delay
Observable • A marriage of Iterables and the Observer Pattern
• Typical Sequence functions - Map, Filter, Reduce, Take • Subscribe/OnNext • Error Handling • Timing function - Delay • Buffering - Last N events
Observable • A marriage of Iterables and the Observer Pattern
• Typical Sequence functions - Map, Filter, Reduce, Take • Subscribe/OnNext • Error Handling • Timing function - Delay • Buffering - Last N events • Composable - SelectMany/FlatMap
Marble Diagrams
A Marble Diagrams
A Marble Diagrams
A B Marble Diagrams
A B Marble Diagrams
A B A.merge(B Marble Diagrams
A B A.merge(B Marble Diagrams
A B A.merge(B Marble Diagrams
A B A.merge(B Marble Diagrams
A B A.merge(B Marble Diagrams
A B A.merge(B Marble Diagrams
A B A.merge(B Marble Diagrams
A B A.merge(B Marble Diagrams
A B A.merge(B Marble Diagrams
A B A.merge(B Marble Diagrams
A B A.merge(B Marble Diagrams
Autocomplete • On Keyup • Get the value of the
field • Only values of length 3 or more • Make remote call • Filter out bad response • Display results
Autocomplete in reality • On Keyup • Get the value
of the field • Throttle to 500ms • Only values of length 3 or more • Skip duplicates • Make remote call • Filter out bad response • Display results
Demo Source code: https://github.com/Cicayda/yolk-examples