Advanced React- useCallback() Invalidates Too Often in Practice #14099

useEventCallback.jsx

/*
    Notice: This hook would be problematic in concurrent mode:
    https://reactjs.org/docs/hooks-faq.html#how-to-read-an-often-changing-value-from-usecallback
*/
function useEventCallback(fn, dependencies) {
  const ref = React.useRef(() => {
    throw new Error('Cannot call an event handler while rendering.');
  });
  React.useEffect(() => {
    ref.current = fn;
  }, [fn, ...dependencies]);
  return React.useCallback((...args) => (0, ref.current)(...args), []);
}