Flux and redux
•Download as PPTX, PDF•
2 likes•564 views
Walk through Flux and Redux design
Recommended
More Related Content
Similar to Flux and redux
Similar to Flux and redux (9)
More from Morgan Cheng
More from Morgan Cheng (13)
Recently uploaded
Recently uploaded (20)
Flux and redux
- 1. Flux & Redux Morgan Cheng
- 2. 2006 2010 2013 2015
- 3. Problem
- 4. More Problem
- 5. So, Flux is THE ONE?
- 6. “React + Flux can do in just 137 lines what jQuery can do in 10!” “What about thousands of lines of code”
- 7. “React + Flux can do in just 137 lines what jQuery can do in 10!” “What about thousands of lines of code”
- 8. Predictable
- 10. UI = f(state)
- 13. Game Time: Let’s Play Flux
- 14. Drawbacks of Flux • Inter-dependency among multiple stores • Hard to support Server Side Rendering • Hard to do hot-reloading
- 15. Flux is just an idea
- 16. So Many Weapons
- 17. Redux is Flux
- 18. Redux = Reducers + Flux
- 19. Reducer (accumulation, input) => new_accumulation (state, action) => new_state
- 21. What If I Told You The State is Immutable
- 22. Three Principles of Redux • Single Source of Truth • State is read-only • Changes are made with pure functions
- 23. Game Time: Let’s Play Redux
- 25. Code Demo Time
- 28. Convention is NOT enough Constraint Matters！
Editor's Notes
- Flux and React are published together in 2013 by Facebook. The counterpart is templates + jQuery family. Redux is a new form of Flux.
- This doesn’t look like MVC in common sense, but it is reality for Facebook. It is argued that Flux is just another form a MVC after its release.
- Spaghetti of event handling hooks. The root cause is that data flows in too many directions.
- Will Flux same us from the hell? Maybe.
- Warnings: React + Flux would make you write more lines of code for small projects. However, it keeps projects in good shape after they evolves into giant projects.
- Warnings: React + Flux would make you write more lines of code for small projects. However, it keeps projects in good shape after they evolves into giant projects.
- The most important thing in software engineering is Predictable.
- http://staltz.com/unidirectional-user-interface-architectures.html
- No more bullshit. Let’s play with Flux game. I need 3 volunteers acting stores: Unread, ChatBox and ContactList of Facebook homepage.
- Flux is hard to support Server Side rendering, because: 1. Singleton Store, Dispatcher and actions 2. No concept of “we’re done” which is required in server side rendering Hard to do hot-reloading, Since state and store logic are combined
- So many Flux-style frameworks.
- A lot of implementations of Flux
- Dan explains how to reduce Flux to reducers https://www.youtube.com/watch?v=xsSnOQynTHs
- Same volunteers to play same games, but in Redux this time.
- One good example is Routing. Second example could be animation.
- How to choose? Flux or Redux? Flux is not actually more superior to Redux.
- Redux Constraints: Single State Tree Actions describes update. Reducers apply updates. If you want to update store, you have to fire an action to be handled by reducers.