Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Questions on State vs. Flux Stores for multi-feature application

I have been learning a lot about flux + react preparing for the upcoming project that will use React + Flux (alt implementation). While all the concepts are all clear to me regarding the flux architecture and how they are all connected together. I do have doubts about how page/view -specific data should be handled.

In a large scale multi-feature application, it is natural that application-wide state/data such as Authentication status or other global features should be handled by flux action/store to easily handle cross-component state. If it is in a angular 1 application, these data/state would go to a factory.

However, for page/view-specific data/state where it would pretty much never communicate across top-level component, would it make more sense to just manage the data in the component state? For example, if my application contains different mini-apps that are quite unrelated, such as a weather forecast view and a calculator, wouldn't it make the component more re-usable if its state is managed internally?

I am just imagining if I have a "calculator" component that self-contains its state, it would have a very self-contained reusable calculator component that I can put anywhere in my application, and yet, if the calculator state is stored in a flux store, then the component will have much more dependencies. Ultimately, say if I want to allow two calculator instance in my application in the future, if flux stores are used, i'd have to change the structure to say include an instance-id in the store. Yet if component states are used all I need is to create two components.

I am still relatively new to React + flux and still trying to get all the concept right. Feel free to correct me if anything.

like image 445
AbSoLution8 Avatar asked Nov 09 '22 09:11

AbSoLution8


1 Answers

I think you have it spot on. Just a couple of thoughts...

  • Where you do have any coordination between components (siblings, parent-child), stores are very helpful and I find them much better than trying to pass props back and forth

  • Where data changes and needs to be persisted to the server, using a store is very helpful. Whether the store actually saves the data — or just notifies the component that the update succeeded will depend on your application.

like image 80
Hal Helms Avatar answered Nov 14 '22 23:11

Hal Helms