Evan You는 VoidZero를 만들어 무엇을 하고 있으며 JS 툴체인의 문제는 무엇입니까?

안녕하세요. 제 이름은 왕푸펭입니다.

저는 수석 풀스택 엔지니어이자 17.5k 오픈 소스 프로젝트인 PMP의 저자입니다. 지금은 Notion 스타일의 지식베이스를 개발 중입니다
React Nextjs 및 Supabase를 사용하여 AI 작성 및 협업을 포함하는 HuashuiAI.

에반 유와 VoidZero

두 달 전, Vue와 Vite의 작가인 Evan You는 VoiceZero 회사 설립을 발표하고 수백만 달러의 투자를 받았습니다.

VoidZero는 Vite를 기반으로 하며 프런트엔드 JS 툴체인을 통합하기 위해 Rolldown과 Oxc라는 두 가지 주요 도구를 개발할 예정입니다. 단편화, 비호환성, 낮은 효율성 등의 문제를 해결합니다.

VoidZero 핵심 도구는 Rust 언어로 개발되어 높은 실행 효율성과 빠른 속도를 제공합니다.

JS 툴체인의 문제점은 무엇입니까?

JS 툴체인에는 주로 의미 분석, 변환기, 린터, 변환기, 축소기, 경계선 등과 같은 프로세스가 포함됩니다.

현재 이러한 유형의 도구를 어떻게 사용하고 있나요? 현재 어떤 도구를 사용할 수 있나요? 그들 사이의 관계는 무엇입니까? 정말 비효율적이고 단편적인가요? 아래에서 하나씩 소개하겠습니다.

컴파일과 패키징이 가능한 부분도 있고, 중복되는 기능도 많아, 이들의 관계가 다소 혼란스럽기 때문에 굳이 굳이 분류해서 비교할 필요는 없다는 점 참고하세요.

JS 런타임

소위 런타임이란 언어의 런타임 환경을 말합니다. 런타임이 없으면 언어는 구문 분석하고 실행할 수 없는 문자열 또는 문자열 파일일 뿐입니다.

• Nodejs는 가장 일반적인 JS 런타임으로 안정적이고 성숙하며 매우 풍부한 생태계를 갖추고 있습니다.
• Deno는 TS 지원 및 네트워크 보안에 중점을 두고 최근 몇 년 동안 개발된 JS 런타임입니다. 처음 2년 동안 2천만 달러의 투자를 받았으며 최근 Deno 2.0을 출시하여 현재 빠르게 발전하고 있습니다
• Bun JS 런타임， 성능 및 올인원에 중점

// Nodejs Deno 或 Bun，都是写 JS 代码
const server = Bun.serve({
  port: 3000,
  fetch(request) {
    return new Response("Welcome to Bun!");
  },
});

console.log(`Listening on localhost:${server.port}`);

참고: JS 런타임은 JS 툴체인의 일부가 아니며 가장 기본적인 기능일 뿐입니다. 그러나 이러한 도구와 용어를 이해하면 JS 툴체인과 구별하는 데 도움이 됩니다. 사용해보지 않으셨을 수도 있지만, 그 존재와 기능을 알아야 합니다.

파서/컴파일러

최신 브라우저에서는 아직 TS JSX 및 최신 ES 코드를 직접 실행할 수 없기 때문에 웹 프런트엔드 개발에서는 다양한 브라우저와의 호환성을 고려해야 합니다.

그래서 TS JSX ES 등 개발 환경의 코드를 브라우저(주로 ES5)에서 실행할 수 있는 JS 코드로 변환해야 합니다.

Babel은 풍부한 생태계와 플러그인을 갖춘 JS를 사용하여 개발되었으며 오랫동안 웹팩 롤업과 같은 패키징 도구에 통합되어 이 작업을 수행한 최초의 회사 중 하나입니다.

하지만 Babel은 JS로 개발되었기 때문에 상대적으로 실행 효율성이 낮습니다. 게다가 Babel은 TS JSX를 컴파일할 때 수동 구성이 필요하므로 상당히 번거롭습니다.

SWC는 Rust 언어로 개발된 JS 컴파일러로, Babel(다른 CPU에서)보다 20~70배 빠르며, Babel을 대체하는 것을 목표로 TS 및 JSX 구문을 기본적으로 지원합니다. Vite는 내부적으로 SWC를 사용합니다.

Rspack은 Rust 언어를 사용하여 개발되었지만 단순한 JS 컴파일러는 아닙니다. 효율성이 높은 종합 포장 도구입니다.

Rspack과 마찬가지로 ESBullid는 Go 언어를 사용하여 개발되었으며 JS 컴파일러를 포함하는 포괄적인 패키징 도구이므로 매우 효율적입니다.

린터 및 포맷터

이 섹션에서 일반적으로 사용되는 것은 ESLint와 Prettier이지만 사용법에 있어서도 약간의 혼란이 있습니다

• ESLint에는 권장, Airbnb, Google, StandardJS 등 다양한 구성 표준이 있으며 모든 사람이 다르게 사용할 수 있습니다. 프로젝트마다 구성이 다를 수도 있습니다
• ESLint와 Prettier는 일부 기능이 중복되어 사용 시 선택이 어렵고, 중복된 구성이 있을 수 있습니다

축소기

UglifyJS는 JS 코드를 압축하는 데 처음으로 사용된 것 중 하나였으며 현재 다운로드 볼륨도 매우 큽니다.

Terser는 UglifyJS 소스 코드를 기반으로 개발되었으며 ES6의 새로운 구문을 지원하고 트리 쉐이킹을 최적화합니다.

그러나 이제 SWC 및 esbulid와 같은 새로운 도구도 JS 코드 압축을 지원하며 실행 효율성이 더 높아집니다. 결국 Rust나 Go는 본질적으로 JS보다 실행 효율성이 훨씬 높습니다.

경계자

패키지는 Webpack Vite, Parcel 등 우리가 가장 자주 접하는 패키지입니다. 후자는 일반적으로 사용되지 않을 수도 있지만 잘 정립된 도구이기도 합니다.

Vite는 SWC를 통역사로 사용하는데, 이는 매우 효율적입니다. 개발 환경에서는 패키징을 위해 에스불리드(esbulid)를 사용하고, 프로덕션 환경에서는 패키징을 위해 롤업(rollup)을 사용합니다.

한편 esbulid(앞서 소개한 것처럼 Go 언어로 개발됨)와 롤업을 패키징 도구로 별도로 사용할 수도 있으며, 많은 타사 JS 플러그인이 롤업을 사용하여 패키징됩니다.

Turbopack은 Vercel에서 Next.js 프로젝트용 Rust를 사용하여 개발한 JS 패키징 도구이며 독립적으로 사용할 수도 있습니다.

Rspack은 Rust(JS 컴파일러와 함께)를 사용하여 개발된 JS 패키징 도구로, webpack을 대체할 수 있고 매우 빠릅니다.

SWC는 자체 패키징 도구인 swcpack도 개발 중입니다. 너무 많아서 지저분하다고 생각하시나요? 단편화되어 있나요?

러스트를 사용하는 이유

왜 그렇게 많은 도구를 Rust 언어로 개발해야 하는지 궁금하실 겁니다. 크게 두 가지입니다

• Rust는 네이티브 코드로 컴파일하고 직접 실행할 수 있는 컴파일된 언어로 C와 비슷한 성능을 제공합니다.
• Rust 메모리 관리는 더 안전하지만 C 메모리 관리는 버그가 발생하기 쉽습니다

끝

JS 툴체인의 세 가지 문제를 되돌아보며

• 조각화: 너무 뻔합니다. 다양한 분야, 특히 바위에는 반복적인 도구가 많이 있습니다
• 비호환성: 기존 도구는 새로운 구문, 특히 TS JSX와 호환되며 과도한 구성이 필요합니다
• 낮은 효율성: 이 또한 매우 명백합니다. 도구 분야에서는 JS가 Rust만큼 잘 할 수 없으며 제거되는 것은 시간 문제일 뿐입니다(당황하지 마세요. 이것은 도구 분야일 뿐이고 애플리케이션 분야는 여전히 JS와 TS입니다)

그래서 Vue 작가 Evan You는 눈이 예리하고, 매우 정확하게 보이며, 문제를 직접적으로 지적할 수 있습니다. 게다가 비테라는 이 부분에서 강한 우위와 그립력을 갖고 있다. 이제 Vite는 많은 사용자를 보유하고 있으며 좋은 진입점 역할을 할 수 있습니다.

Vue와 같은 웹 프레임워크와 Vite와 같은 단일 도구가 개발 과정에서 병목 현상에 직면할 때 Evan은 이 순환에서 벗어나 더 높은 수준의 문제를 발견하고 현장에서 실행할 수 있습니다. 우리가 배워야 할 점입니다.

마지막으로 많은 투자를 받은 VoidZero에는 투자 수익이 필요합니다. 앞으로 어떻게 상용화될까요? Vite를 직접 충전하는 것은 불가능한데 어떻게 돈을 벌 수 있나요?

따라오세요. 다음 섹션에서 자세히 분석하겠습니다. 이는 기술과 코드보다 더 가치가 있을 것입니다.

그런데 저는 국제적인 취업 기회를 찾고 있습니다. 기회가 되시면 제 Github 프로필에 저와 연결해 주세요.

위 내용은 Evan You는 VoidZero를 만들어 무엇을 하고 있으며 JS 툴체인의 문제는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!