코드노트

useTransition이란?useTranstion은 React18에서 도입된 Concurrent Rendering 기능의 일부로, UI 반응성과 성능을 개선하기 위해 "덜 중요한 작업을 늦춰서 처리" 하는 훅이다. 사용자가 빠르게 반응을 체감해야하는 작업이 있다면 가벼운 작업과 무거운 작업을 분리 할 수 있으며, UI의 지연(Lag)을 줄이는데 효과가 있다. - 가벼운 작업 예시 : 버튼 클릭, 입력 필드 타이핑 등- 무거운 작업 예시 : 목록 필터링, 차트 업데이트 등언제 사용할까?대량 데이터 필터링, 렌더링, 정렬애니메이션, 차트, 목록 등 복잡한 UI 업데이트사용자의 입력 반응은 빠르게 결과는 나중에 처리하고 싶을 때사용하지 않아도 되는 경우상태 업데이트가 가벼운 경우비동기 fetch 작업 위주로..

useEffect - 리액트 컴포넌트가 렌더링이 될 때, 될 때마다 특정 작업을 실행할 수 있는 리액트 hook이다. - mount : 화면에 첫 렌더링 - Update : 리렌더링 - Unmount : 화면에서 사라질 때 이 3개의 상황에서 useEffect 내부에 있는 코드가 실행된다고 생각하면 된다. - useEffect는 2개의 인자를 받는다. - 첫번째는 콜백함수, 두번째는 배열( [], dependency array )을 받는다. 그래서 일반적으로 두가지 사용법이 있다. useEffect(() => { }) - 컴포넌트가 화면에 처음 렌더링 될때, - 컴포넌트가 리렌더링이 될때 useEffect(() => { }, [value]) - 컴포넌트가 화면에 처음 렌디링이 될때, - [value]배열..