Oxc Transformer 알파

• 

  BoshenProject Lead

• 

  DunqingCore

• 

  overlookmotelCore

Oxc transform(일명 트랜스파일) 알파 릴리스를 공개합니다.

이번 릴리스의 주요 기능은 세 가지입니다.

1. TypeScript를 ESNext로 변환
2. React JSX를 ESNext로 변환(내장 React Refresh 포함)
3. TypeScript 컴파일러 없이 TypeScript Isolated Declarations DTS 출력

알파 단계에서는 빌드 시간 단축을 위해 위 기능을 실험해 보시기를 권합니다.

벤치마크 요약:

• Transform: Oxc는 SWC보다 3~5배 빠르고, 메모리는 약 20% 적게 쓰며, 패키지 크기도 더 작습니다(2MB vs SWC 37MB).
• Transform: Oxc는 Babel보다 20~50배 빠르고, 메모리는 약 70% 적게 쓰며, 19MB 더 가볍고, 설치할 npm 패키지는 2개뿐입니다(Babel은 170개).
• React 개발 + React Refresh: Oxc는 SWC 대비 5배, Babel 대비 50배 빠릅니다.
• TS isolated declarations .d.ts 출력: 일반 파일에서는 TSC 대비 40배, 큰 파일에서는 20배 빠릅니다.

사용 예시

oxc-transform npm 패키지

Vue.js는 빌드 파이프라인에서 isolated declarations용 oxc-transform을 시험 중입니다.

import { isolatedDeclaration } from "oxc-transform";
const dts = isolatedDeclaration(filename, ts);

@lukeed와 @maraisr는 각각 empathic, dldr 패키지에서 oxc-transform으로 변환과 .d.ts 생성을 한 단계로 수행합니다.

아래 예시는 한 번의 변환으로 .js와 .d.ts를 모두 내보내는 방법입니다.

import { transform } from "oxc-transform";
const transformed = transform(filePath, sourceCode, {
  typescript: {
    onlyRemoveTypeImports: true,
    declaration: { stripInternal: true },
  },
});
await fs.writeFile("out.js", transformed.code);
await fs.writeFile("out.d.ts", transformed.declaration);

unplugin-isolated-decl

vue-macros는 esbuild 플러그인 통합 도구로 unplugin-isolated-decl을 사용합니다.

@sxzz는 보고에 따르면 .d.ts 생성 시간이 76초에서 16초로 줄었다고 합니다.

Airtable의 Bazel 빌드

Airtable의 @michaelm은 CI 파이프라인의 Bazel 빌드 안에서 Oxc의 isolated declarations .d.ts 출력을 통합하고 있습니다.

Rust oxc_transformer 크레이트

Rolldown 번들러는 oxc_transformer Rust 크레이트를 직접 사용합니다.

벤치마크 결과

설정은 oxc-project/bench-transformer에 있고, 벤치마크는 해당 저장소의 GitHub Actions에서 확인할 수 있습니다.

(설정 오류가 있으면 정정해 주시면 감사하겠습니다.)

ubuntu-latest에서 줄 수별 예시 측정:

Transform

Lines	oxc	swc	babel
~100	0.14 ms	0.7 ms (5x)	11.5 ms (82x)
~1000	0.9 ms	5.7 ms (6.3x)	38.7 ms (43x)
~10000	14.9 ms	35.9 ms(2.4x)	492 ms (33x)

Isolated Declarations

Lines	oxc	tsc
~100	0.1 ms	23.1 ms (231x)
~1000	3.1 ms	26.8 ms (8.6x)
~10000	3.5 ms	115.2 ms (33x)

패키지 크기

Oxc는 npm 패키지 2개만 받으며 합계 2MB입니다.

Package	Size
@oxc-transform/binding-darwin-arm64	2.0 MB
@swc/core-darwin-arm64	37.5 MB
@babel/core + @babel/preset-env + @babel/preset-react + @babel/preset-typescript	21 MB and 170 packages

메모리 사용량

Oxc는 메모리를 더 적게 씁니다.

parser.ts(10777줄) 변환 시 메모리 — /usr/bin/time -alh node로 측정:

	Max RSS
oxc	51 MB
swc	67 MB
babel	172 MB

다음 릴리스

다음 릴리스에는 ES6로의 타겟 낮추기와 @babel/plugin-transform-modules-commonjs가 포함될 예정입니다.

감사의 말

이번 릴리스에 힘써 주신 @Dunqing, @overlookmotel께 감사드립니다.

또한 관대한 스폰서로 도와주신 snyder.tech, schoolhouse.world, @lukeed, @maraisr께도 감사드립니다.