완벽한 린터를 기다리지 않기로 했다: ESLint V9 마이그레이션, 그리고 Biome 하이브리드 도입기
(blog.lemonbase.team)ESLint V8 지원 종료에 대응해 V9로 마이그레이션하고, 성능 문제를 Biome 하이브리드 도입으로 해결한 레몬베이스 프론트엔드 챕터의 경험을 공유합니다.
도입 배경
- 2024년 9월 ESLint V8 지원 종료 공지, 보안 패치와 버그 수정을 받으려면 V9 마이그레이션이 필수인 상황
- V9부터 .eslintrc.js 기반 설정이 deprecated 되고, Flat Config가 기본이 됨
- 약 400개 규칙, 이원화된 설정 파일 구조, 다양한 플러그인 호환성 확인이 필요했음
마이그레이션 과정
- ESLint 공식 마이그레이션 도구는 @eslint/compat으로 래핑해주는 수준이라 기대에 미치지 못함
- AI 도구로 초안을 생성했지만, 누락된 규칙과 호환성 문제가 다수 발생
- 결국 스프레드시트로 V8/V9 규칙을 한 줄씩 대조하며 전수 조사
마이그레이션 후 성능 문제
- V9로 올렸더니 오히려 154초 → 184초로 30초 더 느려짐
- import/no-cycle 규칙이 V8 대비 10배 느려져 전체의 45.8% 차지
- prettier/prettier 규칙도 10.2%로 이중 파싱 오버헤드가 병목
Biome 하이브리드 도입
- 완전 대체 대신 "같이 쓰면서 이득에 집중"하는 접근으로 전환
- Prettier → Biome Formatter 교체, 포맷팅 14초 → 2초로 단축
- ESLint는 프로젝트의 커스텀 규칙만 담당
최종 결과
- ESLint V8: 154초 → ESLint V9: 184초
- ESLint Only → Biome + ESLint 하이브리드: ~20초
배운 점
- AI에게 마이그레이션을 맡길 때는 계획을 먼저 세우게 하고 사람이 검토, 성공 기준(예: V8 결과와 일치)을 명확히 정의해야 함
- 완벽한 도구를 기다리기보다, 지금 쓸 수 있는 도구를 잘 조합하는 게 더 빠른 길일 때도 있음
주의할 점
- 두 도구를 함께 쓰면 eslint.config.mjs와 biome.json을 모두 관리해야 하고, 규칙 충돌 가능성이 있음
- 어떤 규칙을 어느 도구에서 담당할지 명확히 정해두고, 신규 팀원 온보딩 시 역할 분담 설명 필요
eslint prettier 대신 oxlint oxfmt 써보실 생각은 없나요?
config 1대1 대응하면서 속도는 최소 수십배 빨라집니다
아직 린트 성능 문제를 겪고 계신 분들에게 좋은 인사이트를 줄수 있는 글인것 같네요
저희도 작년 oxc(oxlint) 와 ESLint를 하이브리드로 사용하도록 개선하면서 200초가 이상 소요되던 린팅을 15초 이내로 줄인 경험이 있습니다.
저도 처음에는 AI로 무식하게 마이그레이션을 진행했다가 누락/변질된 규칙들이 자꾸 생겨나서 하나하나 검토할까 고민하다가,
oxc에서 지원하는 규칙을 뽑아내는 스크립트를 AI로 작성하고 oxc 에서 지원하지 않는 규칙만 ESLint 에서 활성화 하도록 개선해두니 이제는 주기적으로 새로 지원되는 규칙을 업데이트하기도 수월해졌습니다...
초기에는 위 과정이 반 자동화였는데 지금은 Skill 로 정의해두어 Claude Code 로 실행하면 되니 부담도 적어져서 좋았습니다