terser、esbuild、swc压缩JS文件

esbuild、swc 和 terser 都是用于 JavaScript 和 TypeScript 代码的工具，但它们在功能和使用场景上有一些区别。以下是它们的详细对比：

未压缩的原始代码：

function add(param1, param2) {
  function double(param) {
    return param * 2
  }
  return double(param1) + param2
}

let result = add(1, 2)
console.log(result)

eval(`function sum(nums) {
  return nums.reduce(add, 0)
}`)

terser

一个 JavaScript 压缩工具，专注于代码压缩和混淆，压缩效果非常好。仅用于压缩，不提供打包或转换功能，通常需要与其他工具（如 webpack 或 rollup）配合使用。

安装

npm install -g terser

执行压缩命令

terser test.js --compress --mangle --output test.min.js

压缩结果

function add(n,u){return 2*n+u}let result=add(1,2);console.log(result),eval("function sum(nums) {\n  return nums.reduce(add, 0)\n}");

⚠️注意： --compress、--mangle等options需要置于test.js文件后面，否则会卡死无反应。

应用场景

webpack默认使用 terser 压缩js，同时也支持 UglifyJS、 SWC、esbuild

esbuild

使用 Go 语言编写，利用多核并行处理，，它比 terser 快 20-40 倍，压缩率只差 1%-2%。

安装

npm install -g esbuild

执行压缩命令

esbuild test.js --minify --outfile=test.min.js

压缩结果

function add(u,n){function e(r){return r*2}return e(u)+n}let result=add(1,2);console.log(result),eval(`function sum(nums) {
  return nums.reduce(add, 0)
}`);

应用场景：

1. Vite 使用 esbuild 预构建依赖。
2. Vite 默认使用 esbuild 来最小化 CSS。 cn.vitejs.dev/config/buil…

SWC

一个基于 Rust 的 JavaScript 和 TypeScript 编译器。

安装

npm install -g @swc/cli @swc/core

执行压缩命令

swc JsMinifyTest.js -C minify=true  -C jsc.minify.compress=true -C jsc.minify.mangle=true -o JsMinifyTest.swc.js

• -C minify=true 移除空格
• -C jsc.minify.compress=true 重写语法使其更体积更小
• -C jsc.minify.mangle=true 重命名变量为更短的名称

压缩结果

function add(n,u){return 2*n+u}var result=add(1,2);console.log(result),eval("function sum(nums) {\n  return nums.reduce(add, 0)\n}");

应用场景：

Parcel 默认使用 SWC 最小化JS （parceljs.org/features/pr…