Memory Leak in an Event Listener

The Scenario

A single-page application is slowing down heavily after users navigate back and forth between a specific dashboard view. The browser profiler shows a massive spike in detached DOM nodes and event listeners that are never garbage collected.

The Brief

You are provided with a React component snippet containing a custom window event listener inside a `useEffect`. The cleanup function is missing. Write the corrected component, explain exactly why the memory leak occurred, and describe how to verify the fix using Chrome DevTools.

Deliverables

• The corrected React component snippet with proper cleanup
• A technical explanation of why detached event listeners cause memory leaks in SPAs
• A step-by-step guide on how to verify the leak is fixed using the Memory tab in Chrome DevTools

Submit Your Work

Your submission is graded against the rubric on the right. If you pass, you get a public Badge URL you can share on LinkedIn. There is no draft save, so work offline first and paste your finished response here.