Member-only story

How To Fix Memory Leak Issue In React Js Using Hook

Bikash dulal
Technology Hits
Published in
3 min readApr 5, 2021

Memory Leak Issue Is the first step toward the lower performance of the project. So we need to take care of memory while developing the project.

Hello everyone, In this article, I am going to discuss the memory leak issue in react application. I am focusing on react hooks rather than class-based. But let's compare class-based with a hook.

In the class-based component, the life-cycle contains three methods for mounting and unmounting the component: componentDidMount(),componentWillUmmount(),componentDidUpdate() respectively. But a functional component using the useEffect() hook will handle all this lifecycle. Since the complexity of useEffect is more as we are doing all three work at once and we may keep updating our state endlessly.

What Is the main reason for the memory leak issue?
Well, the main reason for the memory leak issue is updating the state endlessly.
A simple Issue that may cause memory leak is
Infinite prefetching loops:
This can happen if you’re doing data fetching in an effect without the second dependencies argument. Without it, effects run after every render — and setting the state will trigger the effects again.

--

--

Technology Hits
Technology Hits

Published in Technology Hits

Important, high-impact, informative, and engaging stories on all aspects of technology.

Responses (3)