epic-react-exercises
epic-react-exercises copied to clipboard
🏇🏇🏇 Refactor top-level context providers for performance
There are currently three top level providers for handling the ui state:
- theme
- codeTheme
- menuState https://github.com/mithi/epic-react-exercises/tree/main/providers
I have to refactor this to best practices so that the app will be faster considering the following techniques:
- How to optimize your context value by separating
state
anddispatch
- https://kentcdodds.com/blog/how-to-optimize-your-context-value
- By using
useCallback
anduseMemo
for state update functions https://github.com/kentcdodds/kentcdodds.com/blob/319db97260078ea4c263e75166f05e2cea21ccd1/content/blog/how-to-optimize-your-context-value/index.md
Be sure to measure the performance before and after with chrome dev tools and react component profilers to make sure the changes introduced actually does make things faster... not slower.