Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
React非同期ライブラリを知る
Search
nitaking
September 28, 2018
0
170
React非同期ライブラリを知る
rxjs redux-observableについて
nitaking
September 28, 2018
Tweet
Share
More Decks by nitaking
See All by nitaking
人は30分でLT資料を作って発表できるのか
nitaking
0
250
React Native ことはじめ
nitaking
0
250
2021-06-24 最近のビルドツール調べてみた
nitaking
0
140
Fishのススメ
nitaking
0
72
Blitz.jsの紹介
nitaking
1
1k
Expo WEB × Next.js は実用できるのか?
nitaking
3
1k
react-hooks-loggerつくった話
nitaking
0
510
あの震えるインタラクションを実装したい
nitaking
1
1.4k
アプリリリースまでのつらみあれこれ
nitaking
0
660
Featured
See All Featured
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
10
890
Speed Design
sergeychernyshev
32
1.2k
Building an army of robots
kneath
305
46k
VelocityConf: Rendering Performance Case Studies
addyosmani
333
24k
Being A Developer After 40
akosma
91
590k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
23
1.5k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
667
130k
GitHub's CSS Performance
jonrohan
1032
470k
Build your cross-platform service in a week with App Engine
jlugia
233
18k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
658
61k
The Straight Up "How To Draw Better" Workshop
denniskardys
238
140k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
21
1.2k
Transcript
Reactͷඇಉظॲཧ ϥΠϒϥϦΛΔ bruno / @nitaking_ エアークローゼット
About ɾSatoshi Nitawaki ɾࣾͰbrunoͱݺΕ͍ͯ·͢ ɾܦྺɿࣾSE / SIer ɾݴޠɿJava / PHP
7 / Laravel / ɹɹɹɹReact Native(React) ͳͲ
About ຊञͱԬ͕͖ͳΤϯδχΞͳͷͰ ͖ͳํ͜ͷޙ͠·͠ΐ͏ʂ
observableがキてるよ observableで Qiita書いた
Redux-Observable ͬͯͳΜͩ
None
RxJS 6-based middleware for Redux.
RxJS ͬͯͳΜͩ
৮ͬͯΈͨ
BufferCount: count͚ͩόοϑΝ Subscribe: Observer͕σʔλΛߪಡ(?)
৮ͬͯΈͨ
BufferWhen: fn͕ൃՐ͢Δ·ͰόοϑΝ͢Δ
γϦΞϧ௨৴ॲཧͬΆ͍ײ͡
センサ メイン機器 100ms毎とかで 送信 5000ms毎に データ回収 γϦΞϧ௨৴͜Μͳײ͡Ͱͨ͠
Redux-observable ʹͬͯ…
Ͳ͏ͬͯReduxͱ RxJS(ReactiveX)ͷ֓೦Λ Έ߹Θ͍ͤͯΔ͔ʁ
Action In , Action Out ͷ֓೦ ΠϥετɿTomas Nilsson Ҿ༻ɿhttps://makeitnew.io/epic-reactive-programming-with-redux-observable-eff4d3fb952f Epic:
͋ΔఔactionΛόοϑΝˍҰؾʹactionΛ࣮ߦ
ͳʹ͕Ͱ͖Δʁ ɾఆظతͳRequest ʢϙʔϦϯάʣ ɾϙʔϦϯάͷΩϟϯηϧ …etcɹ takeUntil: Ҿ͕؍ଌ͞ΕΔ·ͰΛ์ग़ => actionʹNAVIGATE_BACK͕དྷͨΒϙʔϦϯάΊΔ
ଞϥΠϒϥϦͱͷҧ͍ redux-thunkɿ ɹγϯϓϧɺͦͷෳࡶͳॲཧۤख(?) ɹdispatchࡁΈΞΫγϣϯͷΩϟϯηϧ͕ෆՄ redux-Observableɿ ɹΞΫγϣϯΛϙʔϦϯάͰ࣮ߦͨ͠ΓͰ͖Δ ɹdispatchࡁΈΞΫγϣϯͷΩϟϯηϧ͕Մೳ redux-sagaɿ ɹgeneratorؔʹΑΔ࣮ͷͨΊඇಉظॲཧͷதͰಉظతʹ࣮ ɹdispatchࡁΈΞΫγϣϯͷΩϟϯηϧ͕ෆՄ
ͱɺݴΘΕ͍ͯΔ
ReduxඇಉظϥΠϒϥϦ ɾେখؚΊΕ10ݸۙ͋͘Δ ɾٞͷత̏େϥΠϒϥϦ ɹ(saga/thunk/observable) ɾthunk × saga or observable ͍͍Αͱ͍͏આ
ɾRxJSͷ֓ཁͳΜͱͳ͘Θ͔͕ͬͨ ɾ·ͩ·ͩRxJSͷཧղ͕ඞཁͦ͏ɻएׯͷϋʔυϧʁ ɹ=> ͨͩ͠ɺJSҎ֎ʹݴޠԣஅతʹReactiveXͷ֓೦͑Δɹɹ ɹɹ=> େ͖ͳֶशίετͰͳ͍ʁ ɾReactiveXͷ֓೦͕γϦΞϧ௨৴ʹࣅͯͨ ɾsagaͱobservableൺֱ͞Ε͕͕ͪͩ༻ײҟͳΔʁʁ
͋Γ͕ͱ͏͍͟͝·ͨ͠