5년 된 React 프로젝트, Vite로 빌드 속도 30배 향상!
by DD
8개월 전
조회수 3
5년 된 React 프로젝트의 빌드 도구로 Webpack을 사용해 왔으나, Vite로 전환을 결정함
Vite 도입을 위해 설정 복잡도, 호환성, 생태계, 성능 등을 비교 분석하고, Vite를 선택함
전환 결과, 초기 컴파일 시간 30배 단축 및 설정 파일 감소로 개발 생산성 향상을 달성함
Webpack에서 Vite로의 전환 배경
5년간 사용해 온 Webpack은 프로젝트 규모가 커지면서 설정 복잡도가 증가했다. 설정 파일 관리의 어려움과 빌드 속도 저하로 인해 개발 생산성이 감소했다. 따라서, 더 나은 개발 경험을 위해 Vite로의 전환을 결정했다.
Vite 선택의 결정적 이유
Vite는 설정 단순화와 빠른 HMR 속도를 제공하여 개발 생산성을 향상시킨다. Webpack과 비교하여 초기 컴파일 시간 30배 단축을 달성했다. 따라서, Vite는 개발 환경 개선에 효과적인 솔루션이다.
Vite 전환 과정에서 겪은 어려움
환경 변수 처리 변경과 사내 플러그인 미지원으로 인해 코드 수정이 필요했다. Vite와 Rollup 문서 모두 참고해야 하는 리서치 부담도 있었다. 하지만, 이러한 어려움에도 불구하고, 개발 생산성 향상이라는 긍정적인 결과를 얻었다.