1

I am working on an Angular project which is using ngrx/store.

A component of mine needs data from the backend. So the flow usually is like this:

  1. dispatch Action
  2. invoke Effect --> call backend
  3. update store with data from backend
  4. component uses selector to get the data

Now we have the case that our backend returns lots of data (e.g. 100.000) entries. For some reasons I can not do pagination.

I am currently thinking to NOT keep the 100.000 entries in the store since the data is not used anywhere else in the app (SHARI principle violated). Would you think this is a good idea:

  1. dispatch Action
  2. invoke Effect --> call backend
  3. component listens for ApiCallSuccess Action and uses data from payload.

The benefit from my side would be: We always use Effects to call the backend (consistency).

What would you suggest? The alternative to me is that the component just calls the API and uses data directly.

matthias
  • 1,938
  • 23
  • 51
  • Even if the data is only used in one component, I see no disadvantage to keeping it in the store. It doesn't really take up more memory than directly passed to the component. What disadvantage do you see to storing it? – Will Alexander Mar 09 '22 at 11:43
  • SHARI. And the code would be more centered to the component where it is used. – matthias Mar 09 '22 at 12:25
  • Even if you only have the HARI part of SHARI, it can be worth using the store. Otherwise, you can use component-store or, as you say, simply call the service from the component and consume the data directly. Using actions and effects when the store isn't involved seems like completely unnecessary overhead. – Will Alexander Mar 09 '22 at 12:28

1 Answers1

1

Both options have pros and cons - and I think that it's your choice and your teams choice.

You can also take a look @ngrx/component-store which is a middle ground, and a good fit for state that is bound to the component's lifestyle.

timdeschryver
  • 14,415
  • 1
  • 19
  • 32