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
180

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
490
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
260
Progressive Web Apps - The Future
Avatar for r31gN_ r31gn
2
290
The Magic Behind HTTP/2
Avatar for r31gN_ r31gn
0
160
CSS Architecture
Avatar for r31gN_ r31gn
1
120
Embrace Native JavaScript
Avatar for r31gN_ r31gn
0
96
From Callback Hell To Promises Heaven
Avatar for r31gN_ r31gn
1
150

Other Decks in Technology

See All in Technology
Generative AI Japan 第一回生成AI実践研究会「AI駆動開発の現在地──ブレイクスルーの鍵を握るのはデータ領域」
Avatar for KoheiOgawa shisyu_gaku
0
260
Aurora DSQLはサーバーレスアーキテクチャの常識を変えるのか
Avatar for TomoyaIwata iwatatomoya
1
990
250905 大吉祥寺.pm 2025 前夜祭 「プログラミングに出会って20年、『今』が1番楽しい」
Avatar for Masaya Kudo msykd
PRO
1
930
💡Ruby 川辺で灯すPicoRubyからの光
Avatar for bash0C7 bash0c7
0
120
実践！カスタムインストラクション＆スラッシュコマンド
Avatar for puku0x puku0x
0
410
いま注目のAIエージェントを作ってみよう
Avatar for Marimo supermarimobros
0
260
COVESA VSSによる車両データモデルの標準化とAWS IoT FleetWiseの活用
Avatar for Yuto Osawa osawa
1
290
職種の壁を溶かして開発サイクルを高速に回す~情報透明性と職種越境から考えるAIフレンドリーな職種間連携~
Avatar for daitasu daitasu
0
170
La gouvernance territoriale des données grâce à la plateforme Terreze
Avatar for BlueHats bluehats
0
180
現場で効くClaude Code ─ 最新動向と企業導入
Avatar for TakaakiKakei takaakikakei
1
250
Webアプリケーションにオブザーバビリティを実装するRust入門ガイド
Avatar for nwiizo nwiizo
7
830
要件定義・デザインフェーズでもAIを活用して、コミュニケーションの密度を高める
Avatar for KazukiHayase kazukihayase
0
110

Featured

See All Featured
Why Our Code Smells
Avatar for Brandon Keepers bkeepers
PRO
339
57k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
Avatar for Eileen M. Uchitelle eileencodes
36
2.5k
Rebuilding a faster, lazier Slack
Avatar for samanthasiow samanthasiow
83
9.2k
The Illustrated Children's Guide to Kubernetes
Avatar for Chris Short chrisshort
48
50k
Automating Front-end Workflow
Avatar for Addy Osmani addyosmani
1370
200k
Producing Creativity
Avatar for Steve Smith orderedlist
PRO
347
40k
The MySQL Ecosystem @ GitHub 2015
Avatar for Sam Lambert samlambert
251
13k
Context Engineering - Making Every Token Count
Avatar for Addy Osmani addyosmani
3
44
Art, The Web, and Tiny UX
Avatar for Lynn Fisher lynnandtonic
303
21k
Raft: Consensus for Rubyists
Avatar for Patrick Van Stee vanstee
140
7.1k
The Psychology of Web Performance [Beyond Tellerrand 2023]
Avatar for Tammy Everts tammyeverts
49
3k
Rails Girls Zürich Keynote
Avatar for Gregor Martynus gr2m
95
14k

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