Chaos Mode: Finding & Fixing Race Conditions
summary
A concrete workflow: add random delays in request pipeline (split before and after fetch) behind a localStorage toggle so racey search responses happen ~50% of the time in dev, reproduce failures, then fix by either cancelling outdated effects or by moving to a small state machine/store that ignores outdated responses and serializes loads. Debouncing is shown to reduce load but not eliminate races. Centralize requests through a single-network function for easy injection.
AI-written summary · about
chapters (11)
- 0:00Introduction
- 1:12Search UI example
- 3:40Race condition from timing
- 5:51Debouncing attempt
- 9:26Chaos mode testing
- 11:52Delaying backend calls
- 14:19Chaos mode in dev
- 15:03Fixing race conditions
- 16:54State machine debounce
- 21:32React store integration
- 23:38Key takeaways and rolling versions
related talks
28mRace Conditions in JavaScript Apps
28mDetecting the unexpected in React applications
18mKeep Running at Runtime
21mAsynchronous UX
31mBe lazy, but with strategy
42mHow to stay alive even when others go down:...
33mA Quest to Guarantee Responsiveness: Scheduling On and Off the Main Thread
38mScientific and Safe Chaos Engineering