전체

레거시 JavaScript 프로젝트에 TypeScript를 한 번에 전환하지 않고 단계적으로 도입하는 방법을 정리했다. allowJs 옵션과 체크 수준 조절을 활용해 기존 코드를 유지하면서 타입 안정성을 확보할 수 있었다.

다층 컴포넌트 구조에서 props를 계속 넘기는 문제를 겪고 있었다. React 16.3에서 새로 추가된 Context API를 도입해 해결한 과정을 정리했다.

React 16.3에서 정식으로 공개된 새로운 Context API를 프로젝트에 적용했다. 기존 Redux로 관리하던 단순 전역 상태를 Context로 전환하면서 불필요한 boilerplate를 줄일 수 있었다.

단일 스레드로 동작하던 크롤러의 성능 문제를 멀티프로세싱으로 해결했다. GIL 우회와 프로세스 간 통신 처리 방법을 정리했다.

프로덕션 환경에서 간헐적으로 발생하던 UnhandledPromiseRejection 경고를 추적했다. Promise 체인에서 에러 핸들링을 누락한 부분을 찾아 해결한 과정을 기록한다.

여러 API를 병렬로 호출하는 과정에서 Promise.all의 에러 핸들링 방식이 문제가 되었다. 하나의 요청이 실패하면 모든 요청이 중단되는 문제를 해결한 과정을 기록한다.

React 16.3에서 componentWillMount, componentWillReceiveProps, componentWillUpdate가 deprecated 되었다. 레거시 코드베이스에서 이를 대응하는 과정을 정리했다.

API 응답 파싱 작업 중 KeyError 처리가 반복되어 딕셔너리 기본값 처리 방법들을 정리했다. get(), setdefault(), defaultdict() 각각의 사용 케이스를 비교한다.

대시보드 프로젝트에서 불필요한 리렌더링으로 인한 성능 문제를 겪었다. shouldComponentUpdate와 PureComponent를 활용해 렌더링 횟수를 70% 가량 줄인 과정을 정리했다.

여러 API를 동시에 호출하는 대시보드에서 Promise.all 사용 시 하나의 요청 실패로 전체가 실패하는 문제를 겪었다. Promise.allSettled 폴리필과 에러 핸들링 패턴을 적용해 개선한 과정을 정리했다.