[React] 컴포넌트 성능 최적화(React.memo와 useCallback, useReducer)
리액트 컴포넌트 성능 최적화 흐름 많은 데이터 렌더링하기 크롬 개발자 도구를 통한 성능 모니터링 React.memo를 통한 컴포넌트 리렌더링 성능 최적화 함수가 새로워지는 현상 방지하기 react-virtualized를 사용한 렌더링 최적화 투두리스트앱을 가지고 테스트해보겠다. 많은 데이터 렌더링하기 랙lag을 경험할 수 있도록 많은 데이터 렌더링해보기 function App() { const createBulkTodos = () => { const array = []; for(let i = 1; i { setTodos(todos.filter(todo => todo.id !== id)); }, [todos], ) const onToggle = useCallback( (id) => { setTodos( t..
2023. 12. 28.
최근댓글