Search code examples
reactjsreactjs-flux

Flux + Data Lifecycle


In a FLUX application a given set of data is populated in the stores via an action such as initialize. What does one do if:

  1. A store should be incrementally initialized. (Adding users one at a time).
  2. If a user is already in the store, don't go fetch the users again unless its been a while.

Making the HTTP request in disparate action creators seems like you would end up with more requests than you wanted. Do you need two levels of caching? One at the action HTTP API layer (action creator) and one in the stores? Doesn't this seem redundant?


Solution

  • I'd keep all that logic in the store. The key is to have separate action creators for fetch, receiving and errors.

    1. Call the incremental fetch actions however appropriate. The store handles the fetch action, checking if present in the cache. If not, it makes request.
    2. API response is pushed into a receive action. When this action is handled in the store, it adds it to the cache however appropriate, then kick off your store change event.
    3. If the response is an error, push that into an error action creator, so you can handle that elsewhere.

    If there's a chance of multiple fetch actions before the response comes back, you could push a placeholder into the cache like Micah is doing.