폼 최적화는 어떻게 해야할까

• custom hook으로 input field를 재사용화를 한다면
  • 인풋을 관리하기 편해진다

  • • DOM을 직접 참조하여 조작하지 않고, 리액트 state, props, 데이터 흐름으로 관리
      • 선언적 접근

      •   import { useState } from "react";
          
          export const useInput = initialValue => {
          	const [value, setValue] = useState(initialValue);
          	
          	return [
          	{ value, onChange: e => setValue(e.target.value)},
          	() => setValue(initialValue);
          	]
          };

    Link to original

• 하지만 각 자식에게 상태를 책임지면 트레이드 오프 발생

  • Transclude of 전역,-ATOM-상태-필요성#^f7d38f

• 최적화 방법
  • 단순한 입력은 부모가 관리
  • 복잡하거나 느린 입력
    • UseDebounce로 느리게 부모에게 전달
  • ref나 callback 으로 자식으로부터 값(상태) 가져오기