web-dev-qa-db-ja.com

babel-minify vs terser(代わりにuglify-js)

私はES6 +に比較的新しい(最近のJavaScriptと呼ばれます)が、必要なブラウザーで使用したい場合は、 babel-minify または terser が必要です。 (最初、Babiliは別のプレイヤーだと思っていましたが、それは単に 古い名前 Babel-Minifyの)

ブラウザのポリフィルについては、 @ babel/polyfill または Polyfill.io のような生産準備のできたソリューションがあり、それらを使用して、より小さい+高速のコードを最新のブラウザに送信することができます。ポリフィルはほとんど必要ありません(ブラウザをすばやくテストし、必要なポリフィルを動的にロードしてから、アプリのメインスクリプトを起動します)。したがって、これらの最新のテクノロジーを使用することは絶対に合理的と思われます。

babel-minifyまたはterserの選択に関するジレンマがあります。

Webpackチーム 切り替えることを決定 to来るWebpack 5のterser.
Babelチームは 比較表 を作成し、terserの方がはるかに高速であることを示しました。
ドキュメント saysterserは、以前に広く使用されていたuglify-esのフォークです。

これらは私にterserを選択しなければならないと考えさせます。

しかし、一方で、バベルは変換のためにまだ必要です(そして多くの有用なものに使用することができます)。彼らはずっと前にビジネスに携わっています(Babili/babel-minify最初にリリースされた 2016年8月26日でしたが、uglifyは古いです)。 GitHubには優れた開発者コミュニティがあり、バグはすぐに発見され、修正される可能性があります。これらに基づいて、生産の安全な出力に関して、私は彼らにより信頼を感じています。しかし、babel-minifyterserよりも優れていることを示す記事は見つかりませんでした。

質問:

terserを使用します。これは有望なようで、上記の理由ですが、

  • terserではなくbabel-minifyを使用する必要がある場合はどうなりますか?
  • Babelパッケージですべてのことを行う利点はありますか?
8
ARS81

ほとんどの場合、terserまたはbabel-minifyを使用するかどうかは重要ではありません。とはいえ、babel-minifyを使用する利点は、残りのbabelエコシステムと緊密に統合されることです。 webpackなどのバンドラーの外部またはCLIでbabelを使用している場合、babel-minifyは他のbabel変換と同時に実行できるため、最小限の追加設定が必要です。 Babel-minifyは、たとえばbabel-loaderでキャッシュを有効にしている場合、残りのbabelプラグインと同じキャッシュを使用することもできます。

もともと、ES6以降と互換性のあるuglify-jsバージョンがなく、babelには新しい構文をサポートするパーサーが既にあったため、babel-minify(the babili)が作成されました。それ以来、terserは優れた代替手段になり、ES6をサポートしながら、babel-minifyよりも高速に動作します(おそらくbabelの変換パイプラインに結び付けられていないため)。これとあなたがリストした理由により、terserはおそらく今選択するのに最適なオプションでしょう。

考えられる例外の1つは、ECMAScriptの一部としてまだ標準化されていないが、babelのパーサーで(おそらくプラグインで)サポートされている実験的構文を使用する場合です。この場合、babel-minifyが有益であることが判明する可能性があります。

7
16patsle