Redux: Persist Your State – Async LA – Medium

Redux: Persist Your State  #redux #react #reactnative #reactjs #reactjs

  • You create your store from scratch, initialize state, and maybe set some basic state based on the url (if you are in a browser).
  • But the blob could be days, weeks or years old!Redux Persist provides a consistent, performant, and structured way to persist state.If you still require more convincing, read Jani Eväkallio’s piece on offline first applications.Part 2: Architecture2.1 The Component PartsThe “persistence layer” is actually two stateful reactive objects, plus a higher…
  • It also creates register and rehydrate methods which will be used to register each persistoid, and dispatch the actual rehydrate action respectively.PersistoidThe persistoid is the actual state sink.
  • additionally it handles the PURGE action for clearing stored state.2.2 Whats new in Redux Persist v5code splitting reducersbetter integration story for libs (e.g. redux-offline)ability to colocate persistence rules with the reducer it pertains tofirst class migration supportenable PersistGate react component which blocks rendering until persistence is complete (and enables similar patterns…
  • Thats means a consistent story around extensibility, and the ability to use redux-devtools to debug any tricky issues internal to the persistence layer.Ergonomic ReduxVanilla Redux requires a ton of ceremony to use.

When your app reloads, the javascript process has nothing in memory. You create your store from scratch, initialize state, and maybe set some basic state based on the url (if you are in a browser)…
Continue reading “Redux: Persist Your State – Async LA – Medium”