Debugging memory issues in ReactJS applications

Memory leaks can occur when resources allocated for a particular task have not been released after the task is finished. This leads to the accumulation of memory until applications do not have enough for the required tasks. In React, memory leaks can occur due to a multitude of reasons.

• Components are not unmounted properly.
• Event listeners are not cleared after use.
• Unnecessary data stored in the state as well as not resetting the state.

This video shows how we can use the memory tab in Chrome Developer Tools to test our application for memory leaks.

The following video was made for internal use at BigBinary. The video is being presented "as it was recorded".