Performance 2

React Hook Form 성능 최적화: watch vs useWatch vs getValues

React Hook Form을 사용하는데 입력 반응 속도가 느리다면 watch의 오남용을 의심해야 한다. 폼의 상태를 구독하여 리렌더링을 유발하는 watch와 값을 조용히 가져오는 getValues의 차이점, 그리고 useWatch를 이용한 렌더링 범위 최적화 전략까지 정리한다. React Hook Form 성능 최적화: watch vs getValues, 그리고 useWatchReact Hook Form(이하 RHF)이 다른 라이브러리보다 빠른 이유는 비제어 컴포넌트(Uncontrolled Component) 방식을 사용하여 입력값이 바뀔 때마다 리렌더링을 하지 않기 때문이다.하지만 개발자가 편의상 watch 함수를 무분별하게 사용하면, RHF의 장점인 'No Re-render' 특성이 사라지고 use..

카테고리 없음 2025.11.26

React (19v) Compiler와 useMemo, useCallback 의 미래

'React Forget'이라는 프로젝트명으로 알려졌던 React Compiler가 드디어 베일을 벗었습니다. 자동 메모이제이션을 통해 useMemo, useCallback, 의존성 배열 관리의 고통에서 해방시켜 주는 이 기술의 원리와 적용 방법을 정리했습니다. React Compiler: useMemo, 이제 진짜 안 써도 될까?React 개발자들을 가장 괴롭히는 건 아마 리렌더링 최적화와 의존성 배열(Dependency Array) 관리일 겁니다. useMemo, useCallback을 남발하다 보면 코드는 지저분해지고, 하나라도 빼먹으면 불필요한 렌더링이 발생하거나 로직이 꼬이게 되죠.버그가 발생하다 보면 "그럼 처음부터 useCallback을 빼고 로직을 작성하자" 싶다가도, 나중에 성능 문제가 ..

카테고리 없음 2025.11.23