javascript - babel-minify vs terser(而不是 uglify-js)

标签 javascript webpack babeljs uglifyjs babel-polyfill

我对 ES6+(称为现代 JavaScript)比较陌生,但似乎如果我想在浏览器中使用它,我需要 babel-minifyterser . (开始我以为 Babili 是另一个播放器,但它只是 Babel-Minify 的 the old name)

关于浏览器的 polyfill,有生产就绪的解决方案,如 @babel/polyfillPolyfill.io有了它们,就可以向现代浏览器发送更小、更快的代码,因为它们不需要/很少需要 polyfill(快速测试浏览器,动态加载所需的 polyfill,然后启动我们应用程序的主脚本)。因此,使用这些现代技术似乎是绝对合理的。

关于选择 babel-minifyterser 我的两难选择。

Webpack 团队 decided to switch到即将推出的 Webpack 5 中的 terser
Babel 团队制作了一个 comparison table显示 terser 的速度要快得多。
文档 says terser 是以前广泛使用的 uglify-es 的一个分支。

这些让我觉得我必须选择terser

但另一方面,Babel 仍然需要进行改造(并且可以用于许多有用的事情)。他们很久以前就从事这项业务(虽然 Babili/babel-minify 在 2016 年 8 月 26 日是 first released,所以 uglify 更旧)。他们在 GitHub 上有一个很棒的开发者社区,错误可能会更快地发现和修复。基于这些,在生产安全输出方面,我对他们更加信任。但是我还没有找到任何文章显示 babel-minify 优于 terser 的优点。

问题:

我会选择 terser,因为它看起来很有前途,而且原因如上所述,但是:

  • 什么情况下我应该使用 babel-minify 而不是 terser
  • 使用 Babel 包做所有事情有什么优势吗?

最佳答案

在大多数情况下,使用 terser 还是 babel-minify 并不重要。也就是说,使用 babel-minify 的好处是与 babel 生态系统的其余部分紧密集成。如果您在像 webpack 这样的 bundler 之外或在 CLI 上使用 babel,babel-minify 可以与其他 babel 转换同时运行,因此需要最少的额外配置。 Babel-minify 也可以使用与其余 babel 插件相同的缓存,如果你通过例如 babel-loader 启用了缓存。

最初,创建 babel-minify(然后是 babili)是因为没有与 ES6 或更新版本兼容的 uglify-js 版本,而 babel 已经有了支持新语法的解析器。从那以后,terser 成为了一个很好的选择,并且比 babel-minify 执行得更快,同时仍然支持 ES6(可能是因为它没有绑定(bind)到 babel 的转换管道)。由于这个以及您列出的原因,terser 可能是现在最好的选择。

一个可能的异常(exception)是,如果您使用尚未作为 ECMAScript 的一部分标准化但在 babel 的解析器中受支持的实验性语法(可能使用插件)。在这种情况下,babel-minify 可能被证明是有益的。

关于javascript - babel-minify vs terser(而不是 uglify-js),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52661999/

相关文章:

javascript - 如果本地字段存在于外部字段中则聚合

javascript - React Js 元素未运行 Webpack 本地服务器

javascript - Awilix 中的错误 "Could not resolve container"

javascript - 在 react 生产构建中删除控制台日志语句?

typescript - 为什么 Babel 不为 IE11 提供 URLSearchParams polyfill

javascript - 防止 jQuery.fn.extend 多次触发

javascript - 如何选择 jQuery 变量内部

reactjs - 如何在 Webpack-React 应用程序中加载外部配置文件而不捆绑它?

javascript - 如何填充 Backbone 集合

sass - webpack sass 到 css 指定特定文件夹?