timeout_cleaner

#Vue3 #JavaScript #Cleanup #Intervals #Timeouts #EventListeners

Cleaning up Timeouts, Intervals, and Events in JavaScript

This script is designed to clean up timeouts, intervals, and events when a parent component unmounts in a Vue 3 application using the Composition API.

What Happens if Interval is Not Cleared?

If the interval is not cleared when the component unmounts, the interval will continue to run in the background. This can lead to:

• Memory Leaks: Since the interval keeps referencing the callback function, it prevents garbage collection, causing memory to be used unnecessarily.
• Unnecessary Computations: The interval will keep executing its code, leading to potential performance issues.
• Unexpected Behavior: If the interval interacts with the DOM or application state, it may cause errors or unexpected behavior after the component is no longer present.

VERSION 2.0

1. Fixed problem with calling cleaner from multiple locations
2. Fixed bug with sometimes not registering "onMounted"