Successfully reported this slideshow.
Your SlideShare is downloading. ×

Art of state management in react

Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Loading in …3
×

Check these out next

1 of 19 Ad
Advertisement

More Related Content

Similar to Art of state management in react (20)

Advertisement

Art of state management in react

  1. 1. Art of state management in React Saravanan Ramupillai @sara_vananr
  2. 2. UI = F(state)
  3. 3. Kinds of State 1. State of an Component 2. State of an Application
  4. 4. Component State
  5. 5. App State
  6. 6. App State !== Component State
  7. 7. What if, we mix both
  8. 8. Pitfall of lifting State Up
  9. 9. Cognitive load Prop drilling Context passing Unwanter re-rendering
  10. 10. Death by Monolith
  11. 11. Pain of Reducers
  12. 12. What could be the better way?
  13. 13. Composing State based on Responsibility
  14. 14. User State Admin State Billing State User Component Admin Component Billing Component App State
  15. 15. User State Admin State Billing State App State WEB Mobile
  16. 16. Zustand
  17. 17. Zustand 1. Create app state based on functional responsibility 2. All the action that manipulates app state goes along with state. 3. Auto updation of UI with the power of Hooks 4. After all, works without react context
  18. 18. Demo https://codesandbox.io/embed/zustand-demo-kh9p1?fo ntsize=14&hidenavigation=1&theme=dark

×