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

Client Side Reactive Programming Using RxJS

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
100
From Callback Hell To Promises Heaven
Avatar for r31gN_ r31gn
1
180

Other Decks in Technology

See All in Technology
VLAモデル構築のための AIロボット向け模倣学習キット
Avatar for Ken Matsui kmatsuiugo
0
170
VPCエンドポイント意外とお金かかるなぁ。せや、共有したろ！
Avatar for tommy tommy0124
1
630
ソフトバンク流！プラットフォームエンジニアリング実現へのアプローチ
Avatar for SoftBank Tech Night sbtechnight
0
140
マルチアカウント環境でSecurity Hubの運用！導入の苦労とポイント / JAWS DAYS 2026
Avatar for GENDA genda
0
750
OSC仙台プレ勉強会　AlmaLinuxとは
Avatar for koedoyoshida koedoyoshida
0
170
楽しく学ぼう！コミュニティ入門 AWSと人が つむいできたストーリー
Avatar for hiroramos hiroramos4
PRO
1
200
AI時代の「本当の」ハイブリッドクラウド — エージェントが実現した、あの頃の夢
Avatar for Masahiko Ebisuda ebibibi
0
130
AWSの資格って役に立つの？
Avatar for Hiroki Takatsuka tk3fftk
2
340
Claude Code のコード品質がばらつくので AI に品質保証させる仕組みを作った話 / A story about building a mechanism to have AI ensure quality, because the code quality from Claude Code was inconsistent
Avatar for nrs nrslib
13
8.3k
ランサムウエア対策してますか？やられた時の対策は本当にできてますか？AWSでのリスク分析と対応フローの泥臭いお話。
Avatar for ひろのぶ hootaki
0
140
会社紹介資料 / Sansan Company Profile
Avatar for Sansan, Inc. sansan33
PRO
16
410k
スクリプトの先へ！AIエージェントと組み合わせる モバイルE2Eテスト
Avatar for Ryo WATANABE error96num
0
180

Featured

See All Featured
JavaScript: Past, Present, and Future - NDC Porto 2020
Avatar for David Neal reverentgeek
52
5.9k
Optimising Largest Contentful Paint
Avatar for Harry Roberts csswizardry
37
3.6k
Building Adaptive Systems
Avatar for Chris Keathley keathley
44
3k
Skip the Path - Find Your Career Trail
Avatar for Mark Kilby mkilby
1
80
Impact Scores and Hybrid Strategies: The future of link building
Avatar for Tamara Novitovic tamaranovitovic
0
230
Save Time (by Creating Custom Rails Generators)
Avatar for Garrett Dimon garrettdimon
PRO
32
2.4k
Navigating Algorithm Shifts & AI Overviews - #SMXNext
Avatar for Aleyda Solis aleyda
1
1.2k
Getting science done with accelerated Python computing platforms
Avatar for Jacob Tomlinson jacobtomlinson
2
140
The Web Performance Landscape in 2024 [PerfNow 2024]
Avatar for Tammy Everts tammyeverts
12
1.1k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
Avatar for Marc Duiker marcduiker
35
2.4k
<Decoding/> the Language of Devs - We Love SEO 2024
Avatar for Nikki Halliwell nikkihalliwell
1
150
Ethics towards AI in product and experience design
Avatar for Skipper Chong Warson skipperchong
2
220

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