Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Speaker Deck
PRO
Sign in
Sign up for free
Better async redux saga
Kushan Joshi
June 28, 2017
Technology
1
330
Better async redux saga
Slides on Generator Functions and Redux Saga
Kushan Joshi
June 28, 2017
Tweet
Share
Other Decks in Technology
See All in Technology
現状のFedCMの動作解説と OIDCとの親和性について- OpenID TechNight vol.19
ritou
2
430
JFrog 最新情報 - JFrog DevOps プラットフォームの今までとこれから / jfrog-update-for-devopskaigi-2022
tsuyo
0
150
スクラムのスケールとチームトポロジー / Scaled Scrum and Team Topologies
daiksy
1
410
UIKitのアップデート #WWDC22
akatsuki174
3
190
20220622_FinJAWS_あのときにAWSがあったらこうできた
taketakekaho
0
110
オンラインでのサーバー切替事例紹介/ColoplTech-05-01
colopl
0
160
組織の崩壊と再生、その中で何を考え、感じたのか。 そして本当に必要だったもの
kosako
9
3.4k
UWBを使ってみた
norioikedo
0
400
Microsoft Build 2022 Recap Party!! Azure のデータ & 分析サービス 注目アップデート / microsoft-build-2022-recap-azure-data-and-analytics
nakazax
0
250
1人目QA奮闘記/QA Engineer's Struggle
mii3king
2
1k
多様な成熟度のデータ活用を総合支援するKADOKAWA Connectedのデータ組織について
kadokawaconnected
PRO
0
190
データチームの境界を考える
yummydum
0
190
Featured
See All Featured
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
29
4.3k
Practical Orchestrator
shlominoach
178
8.6k
Design by the Numbers
sachag
271
17k
Building Your Own Lightsaber
phodgson
94
4.6k
The Web Native Designer (August 2011)
paulrobertlloyd
74
1.9k
Fireside Chat
paigeccino
11
1.3k
Automating Front-end Workflow
addyosmani
1351
200k
Stop Working from a Prison Cell
hatefulcrawdad
261
17k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
498
130k
Producing Creativity
orderedlist
PRO
333
37k
Learning to Love Humans: Emotional Interface Design
aarron
261
37k
A better future with KSS
kneath
225
15k
Transcript
GENERATORS REDUX SAGA & Kushan Joshi
KUSHAN JOSHI Mapbox OpenStreetMap @kushan2020
GENERATORS What are Generator Functions ? Are functions that can
hold state They can be paused / resumed on demand.
GENERATORS Unlike functions, Generator functions do not run to completion
"
GENERATORS Should I run?
GENERATORS EXAMPLE
GENERATORS EXAMPLE
GENERATORS EXAMPLE
GENERATORS EXAMPLE is called an iterator
ITERABLE
ITERABLE
ITERABLE
GENERATORS Built in iterables Array, String, Map, Set, TypedArray
GENERATORS EXAMPLE
GENERATORS EXAMPLE
GENERATORS EXAMPLE
GENERATORS EXAMPLE
GENERATORS EXAMPLE
GENERATORS EXAMPLE
GENERATORS EXAMPLE
GENERATORS What are generators, again ? Give you a nice
way to generate an Iterator
GENERATORS Great! Let us look at Redux
REDUX PROBLEM Store ✈ Action
REDUX PROBLEM Store ✈ ✈ ✈ ✈ ✈ Actions
REDUX PROBLEM Store Async Actions? Async-Action
REDUX PROBLEM Store There are a lot of tools to
solve this problem. Async-Action
REDUX PROBLEM Store There are a lot of tools to
solve this problem. Async-Action
REDUX PROBLEM Store There are a lot of tools to
solve this problem. Async-Action
REDUX PROBLEM Store There are a lot of tools to
solve this problem. Async-Action
REDUX PROBLEM Store There are a lot of tools to
solve this problem. Async-Action
REDUX PROBLEM Store There are a lot of tools to
solve this problem. Async-Action
REDUX PROBLEM Store There are a lot of tools to
solve this problem. Async-Action
REDUX PROBLEM Store There are a lot of tools to
solve this problem. Async-Action
REDUX PROBLEM Store There are a lot of tools to
solve this problem. Async-Action
REDUX PROBLEM Store There are a lot of tools to
solve this problem. Async-Action
REDUX PROBLEM Store There are a lot of tools to
solve this problem. Async-Action
REDUX PROBLEM Store There are a lot of tools to
solve this problem. Async-Action
REDUX PROBLEM Store Async-Action Easy bro!
REDUX PROBLEM Store Async-Action One of them is Redux Saga
REDUX SAGA Is a library which helps manage async actions
with generators. 5 Redux Saga
REDUX SAGA It runs the generator functions for you.
It gives you helper functions to interact with Redux
REDUX SAGA ✈
REDUX SAGA ✈
REDUX SAGA
REDUX SAGA
GENERATORS How does it compare with Redux Thunks Nice!
REDUX THUNKS LOGIN WITH THUNKS
REDUX THUNKS LOGIN WITH THUNKS
REDUX THUNKS LOGIN WITH THUNKS
REDUX THUNKS LOGIN WITH THUNKS
SAGA LOGIN WITH SAGA
SAGA LOGIN WITH SAGA
SAGA LOGIN WITH SAGA
SAGA LOGIN WITH SAGA
SAGA LOGIN WITH SAGA
SAGA LOGIN WITH SAGA
THUNKS FEATURE PARITY WITH THUNKS
GENERATORS Isn’t this just too complex for a login
THUNKS
THUNKS FEATURE PARITY WITH THUNKS
NETWORK RACE
NETWORK RACE
NETWORK RACE
NETWORK RACE
SAGA LOGIN WITH SAGA
SAGA LOGIN WITH SAGA
SAGA LOGIN WITH SAGA ✈ Logout!
SAGA LOGIN WITH SAGA Me?
SAGA LOGIN WITH SAGA
SAGA LOGIN WITH SAGA
SAGA LOGIN WITH SAGA
SAGA LOGIN WITH SAGA
SAGA LOGIN WITH SAGA
GENERATORS Can’t you just use Async / Await and be
happy?
SAGA ASYNC AWAIT IMPLEMENTATION OF REDUX SAGA
SAGA ASYNC AWAIT IMPLEMENTATION OF REDUX SAGA
GENERATORS So, are generators useless?
GENERATORS The whole point of generators is that you can
manipulate them while they are suspended.
GENERATORS Think of it as a conversation between the code
that runs the generator and the generator itself. Generator Redux Saga (runner)
GENERATORS Generator Redux Saga (runner)
GENERATORS Generator Redux Saga (runner)
GENERATORS Generator Redux Saga (runner)
GENERATORS Generator Redux Saga (runner)
GENERATORS Generator Redux Saga (runner)
GENERATORS Generator Redux Saga (runner)
GENERATORS Async or any other magical being Redux Saga (runner)
GENERATORS ? Async or any other magical being Redux Saga
(runner)
GENERATORS Which is why it is so easy to test
a redux saga, at every yield @
REDUX SAGA TESTING
REDUX SAGA TESTING
REDUX SAGA TESTING
REDUX SAGA TAKE AWAYS Generator functions are fun Redux Saga
is an amazing solution to the async action problem
REDUX SAGA THANK YOU
REDUX SAGA TAKEAWAY
REDUX SAGA TAKEAWAY
REDUX SAGA TAKEAWAY
REDUX SAGA TAKEAWAY