Неэффективный useCallback в React‑компоненте

Устраните ошибку и улучшите процесс рендеринга.

const Button = memo(function Button({handleClick}: {handleClick: React.MouseEventHandler}) {
  console.log('render');
  return <button onClick={handleClick}>Click me</button>
});

export default function App(){
  const [visible, setVisible] = useState(false);

  const toggleVisibility = useCallback(() => {
    setVisible(v => !v);
  }, []);

  return (
    <>
      <Button handleClick={toggleVisibility}/>
      {visible && (<div>lorem ipsum</div>)}
    </>
  );
}