What is useEffectEvent and why is it needed?

useEffectEvent is a hook in React that allows you to create stable event handlers without creating new functions on each component render. It is useful when you need to pass a handler to child components or event listeners to avoid unnecessary re-renders or re-subscriptions.

Example of usage:

import { useEffectEvent } from 'react';

function MyComponent() {
  const handleClick = useEffectEvent(() => {
    console.log('Clicked!');
  });

  return <button onClick={handleClick}>Click me</button>;
}

Thus, handleClick retains its reference between renders, which improves performance and prevents unnecessary effects.