Do This, Not That! Side-Effect Management in UIs
summary
Compares using redux-thunk (awaiting promises inside action creators) versus redux-saga (generators with yield fork/join, channels and cancel) to manage async side effects in the Firefox debugger breakpoint refactor; reproduces a real bug where load_source_text runs twice and briefly flashes large files; thunk fixes by moving awaits but spreads coordination into reducers, while sagas solve it with a channel that serializes loads, fork/join to wait, and cancel on navigate, and thus prevents duplicate loads and race errors.
AI-written summary · about
chapters (18)
- 0:00Start
- 0:58Debugger
- 8:23What Does It Mean To Have a Side Effect
- 13:19Sync Requests
- 15:02Refresher on Async in Javascript
- 18:13Problems Are with Using Promises
- 22:16Questions Generator
- 23:34Co-Routines of Java in Java Script Generators
- 26:15What Is a Simple Object
- 27:16Reducer
- 28:59Redux Sagas
- 30:17Scheduling
- 31:09Action Creator
- 36:52Solution with Thunks
- 38:54Blocking Methods
- 39:55Channels
- 40:56Load Source Text
- 43:38Observation
related talks
19mHandling Side Effects in Redux With Redux-Saga
41mRedux Saga, the Viking way to manage side effects
21mLet's Sync the Async- A Primer on Redux Sagas
28mWriting better multi-process hybrid apps with React and Redux
45mPushing it to the edge
27mKeep Your Sanity with Redux Sagas
21mBetter Async with Redux Saga
42mRedux-Saga — Generators, Side Effects, Channels