BT

InfoQ ホームページ ニュース Sucrase - 最新JSランタイムのための高速版Babel

Sucrase - 最新JSランタイムのための高速版Babel

ブックマーク

原文(投稿日:2019/06/24)へのリンク

JavaScript/TypeScriptコンパイラのSucraseの目的は、標準的なBabelコンパイラよりも大幅に高速な開発ビルドを提供することだ。特に大規模なコードベースでテストする場合、ビルドが速ければイテレーションも速くなる。何件かの実験的な測定では、Babelに対して4倍から20倍という速度の向上が見られている。これにより、開発時の開発者エクスペリエンスの改善を享受しつつ、運用時にはこれまで通りBabelを使用することが可能になる。

Sucraseは自身を、開発ビルドをターゲットとした"超高速なBabelの代替品"と説明している。いくつかの制限を前提とすることによって、Sucraseは、Babelに対して大幅な速度向上を達成しているのだ。TypeScriptコードを用意して、SucraseのWebサイトでSucraseとBabel両方のコンパイラの結果を確認すれば、その速度向上を評価することができる。デフォルトの例では、20行のコードを含むソースで、4倍から7倍の範囲での速度向上が見られている。SucraseのGitHubプロジェクトには、66.1万行のコードを含む大きなTypeScriptコードベースがとして提供されている。Sucraseはこれを、Babelの20倍の速度でコンパイルする。

Imgur

このような速度の向上は、コンパイラのスコープの縮小や、パフォーマンスのために保守性を犠牲にするアーキテクチャによって達成されたものだ。スコープの縮小について、Sucraseでは、次のように説明している。

できる限り幅広いJS機能がInternet Explorerで機能するようにコンパイルするのではなく、Sucraseでは、最新のブラウザやNode.jsバージョンでの開発を想定しています。そのために、JSXやTypeScript、Flowといった、非標準の言語拡張機能のコンパイルを重視しています。

SucraseはNode 6やInternet Explorerをサポートせず、CommonJSとレガシなTypeScript、そしてBabel 5モジュールについては、本位ではないが相互運用性のみサポートする、としている。最近のブラウザは、JavaScript言語に含まれる新機能の大部分をネイティブにサポートする上に、開発やテストのコンテキストでの使用を想定しているため、Sucraseコンパイラは、言語機能のより狭い部分を扱うだけでよいのだ。前述のJSX、TypeScript、Flow以外には、現在提案中の以下のJavaScript機能がコンパイル時に考慮されている。

ESモジュール(import/export)、Reactによる開発(react-hot-loader)に対応するための、特別な変換処理も用意されている。上記に述べた以外のJavaScript構文はそのまま"パススルー"するため、使用するJavaScriptランタイムでサポートされていなければならない。開発者側では、最新のブラウザでサポートされている言語機能(例えばStage 4 ECMAScript機能のサブセット)のみを使用しているか、チェックすることが必要だ。Sucraseはコードベースのエラーチェックをしないので、linterやタイプチェッカを併用する必要もある。

アーキテクチャの面では、Sucraseの構文ツリー変換は、パフォーマンス向上のために複雑に結合されている。そのため、プラグインのサポートはなく、新たな言語拡張や将来的な言語機能によって拡張するのは困難である。

Sucraseは、特にビルド時間が長くなるような大規模コードベースにおいて、よりよい開発者エクスペリエンスを提供することを目標にしている。この問題は、極めて反復的なプロセスであるテストでは特に深刻であるため、コンパイルサイクルの改善による恩恵が期待できる。

Sucraseは、しかしながら、Babelを代替することを目的としていない。ドキュメントには次のように記載されている。

実運用環境でSucraseを使用する前に、慎重に検討する必要があります。Sucraseが有益なのは主に開発段階であって、多くの場合、本番のビルドにはBabelあるいはtscの方が適しています。

SucraseはMITライセンスで提供されており、その大部分は、同じくMITライセンスであるBabelパーサのフォークがベースとなっている。バグ報告、プルリクエスト、ドキュメント、テストなど、コントリビューションは形式を問わず歓迎されるが、Contributing Guideに従って行う必要がある。

この記事に星をつける

おすすめ度
スタイル

こんにちは

コメントするには InfoQアカウントの登録 または が必要です。InfoQ に登録するとさまざまなことができます。

アカウント登録をしてInfoQをお楽しみください。

HTML: a,b,br,blockquote,i,li,pre,u,ul,p

コミュニティコメント

HTML: a,b,br,blockquote,i,li,pre,u,ul,p

HTML: a,b,br,blockquote,i,li,pre,u,ul,p

BT

あなたのプロファイルは最新ですか?プロフィールを確認してアップデートしてください。

Eメールを変更すると確認のメールが配信されます。

会社名:
役職:
組織規模:
国:
都道府県:
新しいメールアドレスに確認用のメールを送信します。このポップアップ画面は自動的に閉じられます。