Back|
frontendMissing useEffect Cleanup
mediumbug3m

Missing useEffect Cleanup

0:00

A junior developer wrote this component to track mouse position. Users are reporting that the app gets slower over time, especially after navigating between pages multiple times. Your task is to find the bug causing this performance issue.

0 flagged
tsxclick lines to flag bugs
1
import { useState, useEffect } from 'react';
2
 
3
function MouseTracker() {
4
  const [position, setPosition] = useState({ x: 0, y: 0 });
5
 
6
  useEffect(() => {
7
    const handleMouseMove = (e: MouseEvent) => {
8
      setPosition({ x: e.clientX, y: e.clientY });
9
    };
10
 
11
    window.addEventListener('mousemove', handleMouseMove);
12
 
13
    // Bug is on this line - no cleanup function returned
14
  }, []);
15
 
16
  return (
17
    <div>
18
      Mouse position: {position.x}, {position.y}
19
    </div>
20
  );
21
}
22
 
23
export default MouseTracker;