Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Client Side Reactive Programming Using RxJS

Sponsored · Your Podcast. Everywhere. Effortlessly. Share. Educate. Inspire. Entertain. You do you. We'll handle the rest. →
Avatar for r31gN_ r31gN_
July 25, 2016
Technology
0
190

Client Side Reactive Programming Using RxJS

Avatar for r31gN_

r31gN_

July 25, 2016
Tweet

More Decks by r31gN_

See All by r31gN_
State management in React using Context and Hooks APIs
Avatar for r31gN_ r31gn
0
240
React internals (fibers, coroutines, algebraic effects)
Avatar for r31gN_ r31gn
1
550
10 things you need to know about React 16
Avatar for r31gN_ r31gn
0
410
Breaking React apart Fiber by Fiber
Avatar for r31gN_ r31gn
0
270
Progressive Web Apps - The Future
Avatar for r31gN_ r31gn
2
320
The Magic Behind HTTP/2
Avatar for r31gN_ r31gn
0
170
CSS Architecture
Avatar for r31gN_ r31gn
1
120
Embrace Native JavaScript
Avatar for r31gN_ r31gn
0
99
From Callback Hell To Promises Heaven
Avatar for r31gN_ r31gn
1
180

Other Decks in Technology

See All in Technology
社内でAWS BuilderCards体験会を立ち上げ、得られた気づき / 20260225 Masaki Okuda
Avatar for SHIFT EVOLVE shift_evolve
PRO
1
160
【５分でわかる】セーフィー エンジニア向け会社紹介
Avatar for Safie safie_recruit
0
44k
Exadata Fleet Update
Avatar for oracle4engineer oracle4engineer
PRO
0
1.3k
AI Coding Agentの地殻変動 ～ ai-coding.info の定点観測 ～
Avatar for kotauchisunsun kotauchisunsun
1
510
メタデータ同期に潜んでいた問題 〜 Cache Stampede 時の Cycle Wait を⾒つけた話
Avatar for LINEヤフーTech (LY Corporation Tech) lycorptech_jp
PRO
0
140
Sansan Engineering Unit 紹介資料
Avatar for Sansan, Inc. sansan33
PRO
1
4k
サンタコンペ2025完全攻略 ～お前らの焼きなましは遅すぎる～
Avatar for terry-u16 terryu16
1
570
【SLO】"多様な期待値" と向き合ってみた
Avatar for kaita z63d
2
290
「使いにくい」も「運用疲れ」も卒業する　UIデザイナーとエンジニアが創る持続可能な内製開発
Avatar for NRI Netcom nrinetcom
PRO
1
770
マイグレーションガイドに書いてないRiverpod 3移行話
Avatar for AOKI Taiju taiju59
0
340
作るべきものと向き合う - ecspresso 8年間の開発史から学ぶ技術選定 / 技術選定con findy 2026
Avatar for FUJIWARA Shunichiro fujiwara3
6
1.9k
OSSで構築するIT基盤管理実践事例: NetBox・Snipe-IT・FreeRADIUS+PrivacyIDEA / Practical Case Studies of IT Infrastructure Management Using OSS
Avatar for NTT docomo Business nttcom
0
180

Featured

See All Featured
Practical Orchestrator
Avatar for Shlomi Noach shlominoach
191
11k
Paper Plane (Part 1)
Avatar for Katie Cordina Lindsey katiecoart
PRO
0
5k
Git: the NoSQL Database
Avatar for Brandon Keepers bkeepers
PRO
432
66k
The Power of CSS Pseudo Elements
Avatar for Geoffrey Crofte geoffreycrofte
82
6.2k
Navigating Algorithm Shifts & AI Overviews - #SMXNext
Avatar for Aleyda Solis aleyda
1
1.1k
Digital Ethics as a Driver of Design Innovation
Avatar for Per Axbom axbom
PRO
1
200
What’s in a name? Adding method to the madness
Avatar for The Alliance productmarketing
PRO
24
4k
Discover your Explorer Soul
Avatar for Emna emna__ayadi
2
1.1k
Money Talks: Using Revenue to Get Sh*t Done
Avatar for Nikki Halliwell nikkihalliwell
0
170
StorybookのUI Testing Handbookを読んだ
Avatar for Shingo Yamazaki zakiyama
31
6.6k
The Illustrated Children's Guide to Kubernetes
Avatar for Chris Short chrisshort
51
52k
Leo the Paperboy
Avatar for Maya Tellez mayatellez
4
1.5k

Transcript

  1. Client-side reactive programming (using RxJS)

  2. Current state of UIs • Extremely complex • Full of

    async events, client/server communication • UIs are always composed based on a state • State is hard to reason about

  3. Imperative programming

  4. None

  5. User action UI Responds User action ….. Uses imperative programming

    Uses imperative programming UI Responds time (s)

  6. Caveats of IP • Isolates state from time • You

    don’t see the bigger picture • Mutable values

  7. Is there a way … ?

  8. Reactive programming

  9. – Andre Staltz “Reactive programming is programming with asynchronous data

    streams.”

  10. Streams • Sequence of ongoing events ordered in time •

    Cheap, ubiquitous • Allow you to react to new data • Think event busses, typical click events, etc.

  11. But in RP …

  12. None

  13. Demo time with RxJS

  14. When to use RxJS • Orchestrate event-based computations • Deal

    with async data • Complex UIs with lots of user interaction

  15. Thank you! @r31gN_ https://github.com/r31gN/rxjs-demo-presentation