Hooks play a very important role in the React application. It helps us to add functionalities in the application.
We can use hooks only in functional components.
Hooks :-
- useState()
- useEffect()
- useReducer()
- useRef()
- useMemo()
- useCallback()
- useLayoutEffect()
- useId()
- useContext()
state Management: useState for the simple state management while useReducer for the complex state management.
Side effects: useEffect can be used for the side effects like data fetching.
Dom manipulation: useRef helps to access the DOM elements.
Sharing global data: useContext helps us to share the state between the components and avoids the prop drilling.
Performance optimization: useMemo and useCallback both hooks help to optimize the performance of the application by memorizing the value and function.
useMemo avoids the unnecceary calculations.
useCallback avoids the unnecessary re-rending components.
generate unique ID: useId can be used to generate unique IDs.
for more details : Learn React Hook
Top comments (0)