Frontend

React 18로 업그레이드하면서 발생한 hydration 에러와 useEffect 중복 실행 문제를 해결했다. Strict Mode의 동작 변경과 Suspense 적용 과정에서 겪은 시행착오를 기록한다.

React 18로 업그레이드하면서 기존 Suspense 구현이 깨지는 문제를 겪었다. fallback이 예상과 다르게 동작하여 원인을 파악하고 해결한 과정을 기록했다.

React 18로 업그레이드하면서 기존 Suspense 구현에서 예상치 못한 동작을 발견했다. lazy loading 컴포넌트의 fallback이 제대로 보이지 않는 문제를 해결한 과정을 기록한다.

TypeScript 4.6으로 업그레이드하면서 조건부 타입 추론이 개선되어 기존 타입 가드 코드를 더 간결하게 리팩토링할 수 있었다. 특히 dependent parameter를 사용하는 함수에서 타입 narrowing이 정확해졌다.

React 18의 useDeferredValue를 실제 검색 기능에 적용해봤다. 기존 debounce 방식 대비 사용자 경험이 확실히 개선됐고, 구현도 더 간결해졌다.

TypeScript 4.6 베타가 공개되면서 destructuring에서의 타입 추론이 크게 개선되었다. 실무에서 자주 사용하는 패턴에서 불필요한 타입 단언을 제거할 수 있게 되었다.

회사 프로젝트에 TypeScript 4.6을 적용했다. Control Flow Analysis 개선과 --incremental 모드 최적화로 빌드 시간이 약 30% 단축됐다. 주요 변경사항과 마이그레이션 과정을 정리한다.

사내 대시보드 프로젝트에 React 18 베타를 적용하면서 Concurrent Rendering과 Suspense를 실전 투입했다. 기존 코드 마이그레이션 과정과 성능 개선 결과를 정리했다.

프로젝트에서 TypeScript 4.5로 업그레이드하면서 const assertion의 타입 추론이 개선된 부분을 확인했다. 특히 템플릿 리터럴 타입과 조합했을 때 유용한 케이스들을 정리했다.

사내 대시보드 프로젝트에 React 18 베타를 적용하면서 useTransition과 Suspense 관련 이슈를 겪었다. 특히 기존 상태 관리 라이브러리와의 호환성 문제가 예상보다 컸다.