ReactHooks2 [React] React-Hooks 간단 정리 (2) 대표적인 최적화 React-Hooks리-렌더링의 발생 조건컴포넌트에서 state가 바뀌었을 때컴포넌트가 내려받은 props가 변경되었을 때부모 컴포넌트가 리-렌더링 된 경우 자식 컴포넌트는 모두리액트에서 불필요한 렌더링이 발생하지 않도록 최적화하는 대표적인 방법memo(React.memo) : 컴포넌트를 메모이제이션(memoization)useCallback : 함수를 메모이제이션(memoization)useMemo : 함수가 리턴하는 값을 메모이제이션(memoization) •React.memo 부모가 리렌더링 되면 자식은 모두 리렌더링 됩니다.1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484.. 2024. 7. 3. [React] React-Hooks 간단 정리 (1) 대표적인 React-Hooks• useState12345678910111213141516171819202122232425// 기존에 우리가 사용하던 일반 방식setState(number + 1); // 함수형 업데이트 setState((currentNumber)=>{ return currentNumber + 1 }); **차이점 button onClick={() => { setNumber(number + 1); // 첫번째 줄 setNumber(number + 1); // 두번쨰 줄 setNumber(number + 1); // 세번째 줄 }} />// 코드가 3개를 써놔도 1번만 실행되어서 1만 증가 button .. 2024. 7. 3. 이전 1 다음