Steps to create React application for understanding all the three hooks
Step 1: Create a React application using the following command:
npx create-react-app usecallbackdemo
Step 2: After creating your project folder i.e. foldername, move to it using the following command:
cd usecallbackdemo
Project Structure:
The project structure
The updated Dependencies in package.json file will look like:
"dependencies": {
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-scripts": "5.0.1",
"web-vitals": "^2.1.4"
}
When to use useCallback, useMemo and useEffect ?
The useCallback, useMemo, and useEffect are used to optimize the performance of React-based applications between rerendering of the components. To answer when to use useCallBack, useMemo, and useEffect, we should know what exactly they do and how they are different.