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
190
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
250
React internals (fibers, coroutines, algebraic effects)
Avatar for r31gN_ r31gn
1
560
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
130
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
Modernizing Your HCL Connections Experience: Visual Report to chain, Profile Enhancements, and AI Integration
Avatar for Wannes Rams wannesrams
0
290
[Oracle TechNight#99] 生成AI時代のAI/ML入門 ~ AIとオラクルデータベースの関係 (前半)
Avatar for oracle4engineer oracle4engineer
PRO
2
240
SLI/SLO、「完全に理解した」から「チョットデキル」へ
Avatar for maru maruloop
1
130
Shiny New Tools Won't Fix Your Problem
Avatar for Trisha Gee trishagee
1
110
AIが自律的に働く時代へ Amazon Quick で実現するAIエージェント紹介
Avatar for こーへい koheiyoshikawa
0
190
古今東西SRE
Avatar for Kaoru okaru
1
130
Databricks Academic Series 〜 大規模言語モデル / エージェント編 〜 / academic-series-llm
Avatar for Databricks Japan databricksjapan
0
110
The 7 pitfalls of AI
Avatar for Uwe Friedrichsen ufried
0
200
Building a Study Buddy AI Agent from Scratch: From Passive Chatbots to Autonomous Systems
Avatar for Patrick Eichler itchimonji
0
140
GKE Agent SandboxでAIが生成したコードを 安全に実行してみた
Avatar for Lamaglama39 lamaglama39
0
210
独断と偏見で試してみる、 シングル or マルチエージェント どっちがいいの？
Avatar for ShichijoYuhi shichijoyuhi
1
240
[Scram Fest Niigata2026]Quality as Code〜AIにQAの思考を再現させる試み〜
Avatar for Masami Yajiri masamiyajiri
1
270

Featured

See All Featured
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
Avatar for Kevin Liebholz kevinliebholz
37
6.4k
Prompt Engineering for Job Search
Avatar for Mfonobong Umondia mfonobong
0
290
The SEO Collaboration Effect
Avatar for Kristina Bergwall kristinabergwall1
1
440
Game over? The fight for quality and originality in the time of robots
Avatar for Wayne Barker wayneb77
1
170
How to build a perfect <img>
Avatar for Jono Alderson jonoalderson
1
5.5k
The Invisible Side of Design
Avatar for Vitaly Friedman smashingmag
302
52k
How to Build an AI Search Optimization Roadmap - Criteria and Steps to Take #SEOIRL
Avatar for Aleyda Solis aleyda
1
2k
End of SEO as We Know It (SMX Advanced Version)
Avatar for Michael King ipullrank
3
4.2k
Designing Experiences People Love
Avatar for Jonathan Moore moore
143
24k
VelocityConf: Rendering Performance Case Studies
Avatar for Addy Osmani addyosmani
333
25k
Building Experiences: Design Systems, User Experience, and Full Site Editing
Avatar for Michelle Schulp Hunt marktimemedia
0
500
GraphQLとの向き合い方2022年版
Avatar for Yosuke Kurami quramy
50
15k

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