L
L
Lesha Fedoseev2015-06-30 12:17:13
React
Lesha Fedoseev, 2015-06-30 12:17:13

Store pre-population strategy in isomorphic flux apps?

Tell us how you fill the stores in isomorphic flux apps.
If on the client we can request data after the component is thrown into the DOM. Then on the server, the store needs to be filled with data before the component is rendered. HigherOrderComponentsA common technique: a static method (for example) is hung on the parent classes ( fetchData), initiating a request to the API and filling the stores. It starts and runs before react starts rendering the app.

<App>
  <SomeItemsHigherOrderComponent> // <----- has static method `fetchData`
    <SomeItems ... />
  </SomeItemsHigherOrderComponent>
  <OtherItemsHigherOrderComponent> // <----- has static method `fetchData`
    <OtherItems ... />
  </OtherItemsHigherOrderComponent>
</App>

In the examples on Github ( flummox , redux ), all static methods are run before rendering (that is, all the stores are filled ) , after which the app is built. How rational is this? Why not run fetchDataonly the component that we are currently rendering? That is, why not take only the data that is required to display the current page? If the user wants to go to the next one, make the next request.
PS The author of flummox gave explanations in the comments to the components ( one , two ), but one way or another, the helper is still written in such a way as to iterate over all components and run all of their static-fetchData methods.

Answer the question

In order to leave comments, you need to log in

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question