- 공유 링크 만들기
- X
- 이메일
- 기타 앱
JavaScript 프로젝트를 시작할 때 가장 먼저 고르는 게 뭘까? 바로 린터다. 코드 품질을 유지하고 버그를 미리 잡는 데 필수적인데, 지금 가장 핫한 선택지는 두 개다: 오래되고 검증된 ESLint, 그리고 속도를 내세우는 새로운 도구 Biome.
둘 다 자기 나름대로 좋은데, 정확히 뭐가 다르고 어떤 걸 골라야 할까? 2026년 기준으로 정리해봤다.
목차
ESLint란?
ESLint는 2013년부터 시작된 JavaScript의 표준 린터다. 거의 모든 JavaScript 프로젝트에서 사용하고, npm 생태계에서 가장 많이 다운로드되는 도구 중 하나다.
ESLint의 강점
1. 압도적인 커뮤니티
12년 역사 동안 쌓인 커뮤니티와 문제해결 자료가 엄청나다. "ESLint 에러 X" 검색하면 대부분 답이 나온다.
2. 플러그인 생태계
React, Vue, TypeScript, Next.js 등 특화된 플러그인이 수천 개가 있다. 자신의 프로젝트에 딱 많는 규칙들을 조합할 수 있다.
3. 세밀한 커스터마이징
거의 모든 규칙을 개별적으로 on/off할 수 있다. 팀 규칙을 정확하게 반영할 수 있다.
4. 검증된 안정성
큰 회사들(Meta, Google, Netflix 등)이 다 쓰고 있다. 버그 리스크가 거의 없다.
ESLint의 약점
속도가 느리다.
큰 프로젝트에서는 린팅 시 수 분 이상 걸릴 수 있다. 번들 크기도 꽤 크다 (약 50MB).
Biome이란?
Biome은 최근 몇 년간 떠오르는 새로운 JavaScript 린터 + 포맷터다. Rust로 만들어져 있고, ESLint의 느린 속도 문제를 해결하려고 설계됐다.
Biome의 강점
1. 엄청 빠르다
Rust로 만들어져 있어서 ESLint보다 10-100배 빠르다. 큰 프로젝트도 밀리초 단위로 처리한다.
2. 번들 크기가 작다
ESLint는 50MB, Biome은 5-10MB 정도다. CI/CD 시간이 확 줄어든다.
3. 포맷터 포함
린터 + 포맷터가 통합되어 있다. Prettier를 별도로 설치할 필요가 없다.
4. 최신 기술
TypeScript, JSX, JSON, YAML 등 최신 포맷을 기본 지원한다.
Biome의 약점
1. 커뮤니티가 작다
아직 신생 도구라 Stackoverflow나 GitHub 이슈 해결이 느릴 수 있다.
2. 플러그인 부족
ESLint 같은 풍부한 플러그인 생태계가 없다. 팀 규칙 커스터마이징이 제한적이다.
3. 아직 성숙 단계 전
빠르게 발전 중이지만, ESLint만큼 검증되지 않았다.
성능 비교
| 항목 | ESLint | Biome |
|---|---|---|
| 린팅 속도 (1000 파일) | 8-15초 | 0.5-1초 |
| 번들 크기 | ~50MB | ~8MB |
| 메모리 사용 | 200-400MB | 50-100MB |
| 포맷팅 속도 | Prettier 별도 (느림) | 통합 (매우 빠름) |
결론: Biome이 압도적으로 빠르다. 특히 큰 프로젝트나 CI/CD 환경에서 성능 차이가 극적이다.
기능 비교
| 기능 | ESLint | Biome |
|---|---|---|
| 규칙 수 | 300+ | 150+ |
| TypeScript 지원 | 플러그인 필요 (@typescript-eslint) | 기본 포함 |
| JSX 지원 | 기본 포함 | 기본 포함 |
| 포맷팅 | Prettier 별도 | 통합 |
| 플러그인 시스템 | 매우 풍부 (수천 개) | 없음 |
| 커스터마이징 | 세밀함 | 기본 규칙만 가능 |
| CI/CD 통합 | 좋음 | 매우 좋음 (빠름) |
ESLint → Biome 마이그레이션
ESLint에서 Biome으로 옮기는 건 생각보다 간단하다.
마이그레이션 단계
1. Biome 설치
2. ESLint 규칙 비교
Biome에서 모든 ESLint 규칙을 지원하지는 않으니, 팀의 핵심 규칙들이 Biome에 있는지 확인한다.
3. biome.json 작성
"linter": {
"enabled": true,
"rules": {
"style": {
"useAsConstAssertion": "error",
"noVar": "error"
}
}
},
"formatter": {
"enabled": true
}
}
4. 점진적 마이그레이션
급하게 교체하지 말고, ESLint와 Biome을 나란히 돌려가면서 차이를 확인한다.
주의:** Biome의 규칙이 더 적으니, "우리 팀 규칙을 다 할 수 있나?"를 꼭 확인하고 시작해야 한다.
어떤 걸 고를까?
ESLint를 선택해야 할 때
- ✅ 팀의 까다로운 커스텀 규칙이 많을 때
- ✅ React, Vue 등 특화된 플러그인이 필요할 때
- ✅ 린팅 설정을 세밀하게 조정해야 할 때
- ✅ 큰 조직에서 표준이 ESLint일 때
- ✅ 검증된 안정성이 최우선일 때
Biome을 선택해야 할 때
- ✅ 속도가 중요한 프로젝트 (큰 모노레포 등)
- ✅ CI/CD 시간을 줄이고 싶을 때
- ✅ TypeScript + 포맷팅을 통합하고 싶을 때
- ✅ 린터 규칙을 단순하게 가져가고 싶을 때
- ✅ 최신 기술 스택을 선호할 때
내 선택
나는 프로젝트 크기에 따라 다르게 간다.
- 소규모 프로젝트 (팀원 1-3명): Biome. 속도와 단순함이 최고.
- 중규모 프로젝트 (팀원 4-10명): 규칙이 복잡하면 ESLint, 아니면 Biome.
- 대규모 프로젝트: ESLint. 보험이다.
FAQ
Q1: Biome이 정말 100배 빠르다고?
A: 숫자는 과장이지만, 1000개 파일 기준으로 ESLint는 10초, Biome은 0.5초 정도면 사실이다. 특히 watch 모드에서 차이가 극적이다.
Q2: Biome으로 갈아타면 규칙을 못 하는 게 많아서 안 될까?
A: Biome이 150개 규칙을 가지고 있는데, 실제로 팀에서 쓰는 규칙은 보통 20-30개다. 대부분 커버된다. 꼭 필요한 규칙이 없으면 GitHub 이슈에 요청하면 빠르게 추가된다.
Q3: ESLint와 Biome을 함께 써도 돼?
A: 가능하지만, 충돌할 수 있으니 권장하지 않는다. 마이그레이션할 때 임시로만 함께 쓰고, 최종적으로는 하나로 정하는 게 낫다.
Q4: Next.js 프로젝트에서는 뭘 써야 해?
A: Next.js 공식 lint 설정은 ESLint 기반이다. 하지만 Biome도 Next.js를 잘 지원한다. 성능이 중요하면 Biome, 규칙 커스터마이징이 중요하면 ESLint.
Q5: Prettier는 어떻게 되는 거?
A: Biome을 쓰면 Prettier는 필요없다. 포맷팅이 통합되어 있으니까. ESLint를 쓰면 Prettier를 따로 설치해야 한다.
Q6: 2026년 지금 Biome은 프로덕션 레벨일까?
A: 충분히 안정적이다. 많은 회사들이 프로덕션에서 쓰고 있다. 다만, ESLint처럼 검증된 건 아니니까 팀 규칙을 꼭 확인하고 가야 한다.
결론: ESLint는 검증된 왕. Biome은 빠른 신흥강자. 팀의 니즈에 맞춰 고르면 된다. 다행히 둘 다 좋으니까, 선택할 기회가 많은 걸 감사하자. 😄
React 성능 최적화 가이드도 함께 보면 린팅과 함께 성능 최적화를 할 수 있다.
- 공유 링크 만들기
- X
- 이메일
- 기타 앱
댓글
댓글 쓰기