useCallback을 써야할때는?

useCallback을 쓰는 이유가, 최적화를 위해서라는데 어떨때 써야하는가?

컴포넌트에 props로 넘겨주는 함수는, useCallback을 써준다.

그래야 최적화가 되기 때문이다.

예시코드

const LoginForm = () => {
  const [id, setId] = useState("");

  const onChangeId = useCallback((e) => {
    setId(e.target.value);
  }, []);

  return (
    <Form>
      <div>
        <label htmlFor="user-id">아이디</label>
        <br />
        <Input
          name="user-id"
          type="e-mail"
          value={id}
          onChange={onChangeId}
          required
        />
      </div>
    </Form>
  );
};