전체

float와 position으로 구현된 대시보드 레이아웃을 CSS Grid로 전환했다. IE11 지원 때문에 고민했지만 autoprefixer로 해결했다.

검색 자동완성 기능 구현 중 과도한 API 호출 문제가 발생했다. lodash debounce를 사용해 해결했지만, React 컴포넌트 라이프사이클과 맞물려 예상치 못한 동작이 있었다.

Node.js 백엔드를 Go로 마이그레이션하면서 goroutine 관리 문제를 겪었다. context 패키지를 활용해 안전한 goroutine 종료 패턴을 정리했다.

기존 JavaScript 프로젝트에 TypeScript를 단계적으로 도입했다. allowJs 옵션을 활용해 JS와 TS를 혼용하며 리스크를 최소화하는 방법을 정리했다.

비동기 작업 스케줄링 중 setImmediate와 process.nextTick의 실행 순서가 예상과 달라 혼란스러웠다. 이벤트 루프 동작 방식을 정리하고 적절한 사용 시점을 정리했다.

프로젝트 전반에 흩어져 있던 에러 처리 로직을 중앙화하는 과정에서 겪은 문제들을 정리했다. try-catch 중복 코드를 제거하고 일관된 에러 응답 구조를 만들었다.

실무에서 대량의 데이터를 처리하다 보니 map, filter, reduce를 체이닝할 때와 for 루프를 사용할 때의 성능 차이가 궁금해졌다. 직접 측정해본 결과를 기록한다.

프로젝트에서 Promise 체이닝 코드를 async/await로 전환했다. 가독성이 확실히 개선되었고, 에러 핸들링도 더 직관적이다. ES2017 스펙이지만 Babel 덕분에 안정적으로 사용 가능하다.

Django로 개발한 API 서버의 응답 속도가 급격히 느려지는 문제를 겪었다. 프로파일링 결과 ORM의 N+1 쿼리 문제였고, select_related와 prefetch_related로 해결했다.

React 16.2에서 추가된 Fragment 단축 문법을 프로젝트에 적용했다. div 래퍼 지옥에서 벗어날 수 있었지만, 몇 가지 제약사항도 있었다.