This article walks through 6 tips for improving your React app's performance.
- Utilize render bail-out techniques
- Avoid inline objects
- Avoid anonymous functions
- Lazy load components that are not instantly needed
- Tweak CSS instead of forcing a component to mount & unmount
- Memoize expensive calculations
In this article, you'll reintroduce closures by building a tiny clone of React Hooks. This will serve two purposes – to demonstrate the effective use of closures, and to show how you can build a Hooks clone in just 29 lines of readable JS. Finally, you'll arrive at how Custom Hooks naturally arise.
As the title suggests, this post takes a deep dive into what Christian is calling the "Memoize hooks", useRef, useCallback, and useMemo.
The main purpose of this article is to help you get an understanding of useContext and useReducer and how they can work together to make React applications and their state management clean and efficient.