Upgrade to Pro — share decks privately, control downloads, hide ads and more …
Sign up for free

Client Side Reactive Programming Using RxJS

Avatar for r31gN_ r31gN_
July 25, 2016
Technology
200
0

Client Side Reactive Programming Using RxJS

Avatar for r31gN_

r31gN_

July 25, 2016

More Decks by r31gN_

See All by r31gN_
State management in React using Context and Hooks APIs
Avatar for r31gN_ r31gn
0
260
React internals (fibers, coroutines, algebraic effects)
Avatar for r31gN_ r31gn
1
580
10 things you need to know about React 16
Avatar for r31gN_ r31gn
0
430
Breaking React apart Fiber by Fiber
Avatar for r31gN_ r31gn
0
290
Progressive Web Apps - The Future
Avatar for r31gN_ r31gn
2
350
The Magic Behind HTTP/2
Avatar for r31gN_ r31gn
0
170
CSS Architecture
Avatar for r31gN_ r31gn
1
140
Embrace Native JavaScript
Avatar for r31gN_ r31gn
0
110
From Callback Hell To Promises Heaven
Avatar for r31gN_ r31gn
1
190

Other Decks in Technology

See All in Technology
生成AIのテナント制御とシャドーMCP対策 | AIを"止めずに"、情報を守る
Avatar for yu yukun
0
140
AIとペアプロを始める。人とのペアプロをやめる。ペアプロの良さを改めて知る。もっと好きになった。 / Rediscovering Pair Programming
Avatar for yuki honyanya
1
330
omasushiというライブラリを作った
Avatar for polidog polidog
PRO
0
180
GoCon2026 - Open Source, Open World
Avatar for sanposhiho sanposhiho
2
1.1k
Claude Code本って、 読む必要あるの？
Avatar for Oikon oikon48
2
350
AI時代に、プロダクトの数だけ積み上がる所有コストをどうエンジニアリングするか / Engineering the Cost of Ownership
Avatar for Kazuki Maeda kzkmaeda
1
1.1k
TinyGo 開発サイクルを高速化する：Go で作るエミュレータ入門
Avatar for ZOZO Developers zozotech
PRO
1
410
GoにおけるFFIのこれまでとこれから
Avatar for Masaaki Goshima goccy
4
1.7k
PfEingのアプローチで働こう
Avatar for rin（林晃 / Akira Hayashi） rindrics
0
210
Sigmaユーザーのための有用リソース一挙公開 & Sigmaで使えるMCP #sigma_ucj /useful-resources-for-sigma-computing-users-and-mcps-with-sigma
Avatar for shinyaa31 shinyaa31
0
180
『止めない』を設計する — 制約の中で、事業の根幹を支える判断
Avatar for Terry hiroyaterui
0
250
Deploying a Full-Stack Bun-Native Framework on Cloudflare Workers
Avatar for daiki7nohe 7nohe
0
120

Featured

See All Featured
Agile that works and the tools we love
Avatar for Rasmus Luckow-Nielsen rasmusluckow
331
22k
XXLCSS - How to scale CSS and keep your sanity
Avatar for Zaharenia Atzitzikaki sugarenia
249
1.3M
Discover your Explorer Soul
Avatar for Emna emna__ayadi
2
1.3k
Balancing Empowerment & Direction
Avatar for Lara Hogan lara
6
1.3k
Beyond borders and beyond the search box: How to win the global "messy middle" with AI-driven SEO
Avatar for David Carrasco davidcarrasco
3
240
Thoughts on Productivity
Avatar for Jon Yablonski jonyablonski
76
5.4k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
Avatar for Vitaly Friedman smashingmag
254
22k
Sam Torres - BigQuery for SEOs
Avatar for Tech SEO Connect techseoconnect
PRO
0
540
A brief & incomplete history of 
UX Design for the World Wide Web: 1989–2019
Avatar for Jason CranfordTeague jct
2
500
Designing Dashboards & Data Visualisations in Web Apps
Avatar for Des Traynor destraynor
232
55k
End of SEO as We Know It (SMX Advanced Version)
Avatar for Michael King ipullrank
3
4.4k
Practical Orchestrator
Avatar for Shlomi Noach shlominoach
191
12k

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