728x90 반응형 SMALL React Hook2 React Hooks (useMemo) useMemo는 메모이제이션된 값을 반환한다. 메모이제이션(memoization)은 컴퓨터 프로그램이 동일한 계산을 반복해야 할 때, 이전에 계산한 값을 메모리에 저장함으로써 동일한 계산의 반복 수행을 제거하여 프로그램 실행 속도를 빠르게 하는 기술이다. useMemo를 사용하면 함수 컴포넌트 내부에서 발생하는 연산을 최적화할 수 있다. 렌더링하는 과정에서 특정 값이 바뀌었을 때만 연산을 실행하고, 원하는 값이 바뀌지 않았다면 이전에 연산했던 결과를 다시 사용하는 방식이다. const memoizedValue = useMemo(() => computeExpensiveValue(a, b), [a, b]); 첫번째 인수에는 어떻게 연산할지 정의하는 생성(create)함수, 두번째 인수에는 의존성 값의 배열을.. 2023. 1. 6. React Hooks (useReducer) useReducer는 useState보다 더 다양한 컴포넌트 상황에 따라 다양한 상태를 다른 값으로 업데이트해 주고 싶을 때 사용하는 Hook이다. Redux를 사용해봤다면 알기 쉽다. const [state, dispatch] = useReducer(reducer, initialArg); (state, action) => newState의 형태로 reducer를 받고, dispatch 메서드와 짝의 형태로 현재 state를 반환한다. 다수의 하윗값을 포함하는 복잡한 로직을 만들거나 다음 state가 이전 state에 의존적인 경우, 보통 useState보다 useReducer를 선호한다. 또한 useReducer는 콜백 대신 dispatch를 전달할 수 있기 때문에, 자세한 업데이트를 트리거하는 컴포넌.. 2023. 1. 5. 이전 1 다음 728x90 반응형 LIST
