본문 바로가기
기타 프론트엔드 관련

Oxlint 등 oxc 간단하게 소개

by East-K 2024. 11. 29.

Oxlint

최근 오랜만에 create vue를 사용해 Vue 기반 프로젝트를 생성하던 중, ESLint 설정 단계에서 Oxlint라는 새로운 옵션을 발견했습니다. Oxlint는 ESLint를 더 빠르게 실행할 수 있도록 돕는 실험적인 도구라고 소개되어 있었는데, 이에 흥미를 느껴 관련 내용을 간단히 조사해보았습니다.


Oxlint란?

공식 문서에 따르면, Oxlint는 다음과 같이 설명됩니다:

Oxlint는 기본적으로 추가 설정 없이 오류가 있거나 불필요한 코드를 감지하도록 설계되었습니다.

참고(INFO)

현재 Oxlint는 ESLint를 완전히 대체하는 것을 목표로 하지 않습니다. 대신, ESLint의 속도가 워크플로에서 병목 현상이 될 때 이를 보완하는 도구로 작동합니다.

Oxlint는 대규모 코드베이스에서도 몇 초 만에 실행되므로, lint-staged 또는 CI 설정에서 ESLint를 실행하기 전에 실행하여 더 빠른 피드백 루프를 얻는 것을 권장합니다.


즉, Oxlint는 ESLint를 완전히 대체하기보다는 보완하는 역할을 목표로 하는 도구입니다. 개인적으로도 실행해보았지만, 작은 규모의 프로젝트에서는 그 효용성을 크게 체감하지는 못했습니다. 대규모 프로젝트에서는 속도 개선의 장점을 더욱 느낄 수 있을 것으로 기대됩니다.

VoidZero와 Oxlint의 배경

Oxlint를 포함한 Oxc 프로젝트는 Vue와 Vite를 만든 Evan You가 설립한 VoidZero에서 개발 중입니다. VoidZero는 아래와 같은 비전을 가지고 툴체인을 설계하고 있습니다:

  • 통합(Unified): 파싱, 변환, 린팅, 포매팅, 번들링, 압축, 테스트 등의 모든 작업에서 동일한 AST, 리졸버, 모듈 상호작용(interoperation)을 사용하여 일관성을 유지하고 중복된 파싱 비용을 제거합니다.
  • 고성능(High Performance): 네이티브 코드로 컴파일되는 언어로 작성되어 처음부터 속도를 위해 설계되었습니다. 최대 병렬화와 낮은 오버헤드의 JS 플러그인 지원을 통해 성능을 극대화하며, 이를 통해 개발자와 최종 사용자 모두에게 개선된 경험을 제공합니다.
  • 조합 가능(Composable): 툴체인의 각 구성 요소는 독립적으로 사용 가능하며, 고급 커스터마이징을 위한 빌딩 블록을 제공합니다.
  • 런타임에 구애받지 않음(Runtime Agnostic): 특정 JavaScript 런타임에 종속되지 않고 모든 환경에서 동일한 개발자 경험을 제공합니다.

이러한 비전을 통해 VoidZero는 Vite를 넘어 JavaScript 생태계 전반에 걸쳐 혁신을 이끌고자 합니다. 이는 매우 야심 찬 목표이며, 이를 실현하기 위해 전념하는 풀타임 팀이 필요하다는 이유로 VoidZero가 설립되었습니다. (Evan You의 게시글 참고)


마치며

이번 게시글은 Oxlint라는 실험적인 도구와 이를 만든 VoidZero의 비전에 대해 간단히 소개하는 내용으로 작성되었습니다. Vite가 자바스크립트 생태계에서 빠르게 성장하고 있는 만큼, Oxc에서 개발 중인 다양한 프로젝트들도 안정화되어 JavaScript 생태계가 더욱 발전하기를 기대합니다.

개발자로서 더 성장한다면, 언젠가 이런 프로젝트에 기여할 수 있기를 바라봅니다.

'기타 프론트엔드 관련' 카테고리의 다른 글

FSD (Feature-Sliced Design) 패턴 맛보기  (0) 2024.11.13