나디아 성장 일기

📌 React 렌더링 과정 및 상태 관리    1️⃣ 렌더링 트리거 👉 첫 주문컴포넌트의 초기 렌더링인 경우(애플리케이션 처음 로드)컴포넌트의 state가 업데이트 된 경우(set함수)=> React는 컴포넌트를 렌더링하여 초기 UI를 생성한다.  이 단계에서 UI는 가상 DOM에 생성된다.   2️⃣ Real DOM 반영 👉 첫 서빙(음식 첫 제공)생성된 UI는 가상 DOM에서 실제 DOM에 반영된다.   3️⃣ 상태 관리 👉 컴플레인(추가 주문) 관리사용자가 애플리케이션의 상태를 변경하거나(상호작용) 컴포넌트의 props가 바뀌면, 상태가 업데이트한다.상태 변화는 애플리케이션의 UI에 영향을 미치기 때문에 적절히 관리되어야 한다.   4️⃣ 컴포넌트 렌더링(ReactDOM으로 리렌더링) 👉 ..

📌 Debounce & Throttle: 자주 사용되는 이벤트나 함수의 실행되는 빈도를 줄여서, 성능의 유리함을 가져오기 위한 개념사용자의 의도와 무관한 요청을 줄이기 위한 기능 (input 입력 이벤트, API로 데이터를 가져오는 이벤트 등)스크롤, 윈도우 리사이즈, 마우스 이동 등의 빈번한 이벤트에서 성능을 최적화하는 데 유용 이벤트가 과도하게 발생하는 것을 제한   ✅ Debounce: 입력 주기가 끝남과 동시에 이벤트를 호출한다.같은 이벤트가 반복되게 발생하는 경우, 반복적으로 발생하던 이벤트가 일정 시간동안 다시 발생하지 않으면 콜백 함수를 실행 아무리 많은 이벤트가 발생해도 모두 무시하고 특정 시간 사이에 어떤 이벤트도 발생하지 않았을 때 딱 한번만 마지막 이벤트를 발생시킨다.키워드 검색, ..