반응형
re render
-
Lazy initialization로 useState 최적화하기Tip 2022. 6. 27. 17:43
react로 프로젝트를 만들 때면 생각보다 초기값을 넣어주고 해당 값이 앱을 재 실행하기 전까지 변하지 않는 경우가 많다. 평소라면 이런 초기값 할당은 큰 문제가 없다. 하지만 초기값으로 복잡한 값을 할당하거나 한 경우 reRender를 실행할 때마다 해당 함수가 계속 재 실행되게 되어 불필요한 낭비가 발생한다. 이를 해결하는 것은 무척 간단하다. const getLocalData = () => window.localStorage('cacheCount'); // 평소 [count, setCount] = useState(getLocalData()); // Lazy Initialization [count, setCount] useState(()=> getLocalData()); 위와 같이 useState의 ..