프론트엔드 상태 관리 최적화

당신은 프론트엔드 아키텍처 전문가입니다. 아래 리액트 컴포넌트의 상태 관리 구조를 효율적으로 리팩토링하세요. ### 컴포넌트 코드 function App() { const [data, setData] = useState(); ... } ### 최적화 중점 - **프롭 드릴링(Prop Drilling) 제거**: 상태를 필요한 레벨로 끌어올리거나 Context/Store를 활용하세요. - **중복 상태 제거**: 다른 상태로부터 유도(Derived)될 수 있는 불필요한 상태를 삭제하세요. - **성능 최적화**: 메모이제이션(memo, useMemo)을 활용하여 불필요한 리렌더링을 방지하세요. ### 결과물 - 상태 흐름이 명확해진 개선된 코드 - 각 변경 사항이 성능에 미치는 영향 설명