Docs need one or more diagrams

[wmertens]

There is no diagram explaining the flow in Redux.

I had some success explaining it with this diagram:

I'd be happy to provide this in png or svg, with any changes you would like.

[Johnius]

Awesome! Thank you!

[alkhe]

I like your diagram, but the shadows and gradients feel a little gaudy. Maybe you could use solid colors instead?

/2cents

[Johnius]

What is selector?

[alkhe]

@Johnius It's what the Connnector uses to make the state more specific and cache the previous value.

[Johnius]

@edge It's a connect() function? I didn't remember the caching possibility in there. Or it's a library?

[alkhe]

@Johnius It doesn't cache by itself, but React does. It implements shouldComponentUpdate by using the old props and doing a shallow equality check on the new props, essentially doing a cache check.

[wmertens]

Science agrees that visuals are important: https://blog.slideshare.net/2015/08/31/the-scientific-reason-why-bullets-are-bad-for-presentations/

[svnlto]

I found this one quite helpful. no mention of selectors however.

[peteruithoven]

Another diagram https://voice.kadira.io/rethinking-redux-f1e96daba60c#.9zs9rp0vf

[Sigmus]

The above diagram for convenience:

[thongly]

Awesome diagrams! Perhaps a flux vs redux diagram would be helpful in explaining the differences between the two as well - and how the presentation components (react) are still entirely separate. Perhaps this belongs in the early parts of the motivation docs, @gaearon

[henriquesosa]

@thongly I'm working in a draft to represent both flux and redux architecture.

[Lassi]

You can find diagrams representing Flux/Redux and other unidirectional data flow architectures here

[gaearon]

Courtesy of http://makeitopen.com/tutorials/building-the-f8-app/data/: