Search code examples
reactjsflux

Where should I put computed datas in the Flux architecture

Ok so let's take the example given by Facebook to introduce Flux : https://www.youtube.com/watch?list=PLb0IAmt7-GS188xDYE-u1ShQmFFGbrk0v&v=nYkdrAPrdcw#t=621

We have an app that :

  • displays messages ;
  • shows a bubble with the number of unread messages.

Here is my question about it :

Where should the unreadCount live?

Here are the 2 options I can think of :

1/ The messagesStore is handling storing the messages and computing the unreadCount every time something happens to the messages (or variant with another store that keeps the count up to date) ;

2/ The messagesStore only stores the raw list of messages and the view that displays the unreadCount is responsible for computing the number of unread messages.

The generic question is :

Should the stores only store pure raw datas or any kind of datas?

Solution

  • Ok so after re-watching the introduction video posted by Facebook (focused enough :) ), it seems that the answer to my question is in the video.

    At the end she says :

    we should use more explicit data on the client instead of derived data

    (source here : https://youtu.be/nYkdrAPrdcw?t=17m8s)

    Which, I think, can be interpreted as : "the view is responsible for computing derived data".
    Which is the answer I was looking for :)