De
develop
Sign In
https://blog.axlight.com/posts/4-options-to-prevent-extra-rerenders-with-react-context/
4 options to prevent extra rerenders with React context
Introduction React context and useContext are very handy. You would have no problem using it while developing a small app. If the size of your app became non-trivial, you might experience some performance issues with regard to useContext. This is because useContext will trigger rerender whenever the context value is changed. This happens even if the part of the value is not used in render. This is by design. If useContext were to conditionally trigger rerenders, the hook would become non-composable.
blog.axlight.com
2
👍
bob
Jun 27, 2023
context api를 사용하면서 rerender를 최적화할 수 있는 방법론
bob
Jun 27, 2023
https://solo5star.tistory.com/42
React Context를 쓰면 전체가 리렌더링된다고?
const App = () => { const [mousePosition, setMousePosition] = useState([0, 0]); // 마우스 움직임을 감지하여 mousePosition 상태 계속 업데이트 useEffect(() => { document.addEventListener('mousemove', (event) => { setMousePosition([event.clientX, event.clientY]); }); }, []); return ( ); }; 이런 구조의 앱이 있다고 가정해봅시다. MouseMovementContext라는게 있고 마우스가 움직이면 상태를 계속 업데이트합니다. MouseMovementContext로 부터 마우스의 위치 상태 값을 받는 컴포넌트는 MouseP..
solo5star.tistory.com
See latest comments
Made with Slashpage