Redux-saga

🍱Framework
javascript
react

task

A task (descriptor) is a non-blocking call and is created by a fork in redux-sagas

  • To cancel a forked task use the dedicated effect cancel.
  • Cancellation of a task propagates downwards (in contrast returned values and uncaught errors propagate upward)

yield vs. yield*

See this answer of the creator of redux-saga:

yield* allows only for sequential compositions (like macro tasks in C/C++)

race

race automatically cancels the loser effects.

you always have to yield in order to get the value

return yield call(setActionToDiscovery, lastDiscoveryTask);

instead of just

return call(setActionToDiscovery, lastDiscoveryTask);

takeEvery vs. while (true) without fork

If you are using while (true) inside sagas to take all events without forking what comes thereafter, so you might miss some events while the saga is still executing. If it’s your intention to not take other events of this type as long as you’re running that specific saga, all is good.

In case you do want to catch all events, a good fix would be to use takeEvery.

Channels

  • Async stuff not related to redux actions etc.
  • Other listeners!

TypeScript

Great article about redux-saga + TypeScript.

Image

Redux-saga visually explained:

redux-saga-circle

redux-saga and TypeScript

  • This article explains it well.
  • The hardest part to type are the return values inside of Generators. The article only advises to write shorter sagas so that this error doesn’t occur.

Discuss on TwitterImprove this article: Edit on GitHub

Discussion


Explain Programming

André Kovac builds products, creates software, teaches coding, communicates science and speaks at events.