^{minification benchmarks}

🙋‍♂️ Why?

1. To help you pick a minifier that fits your needs
2. To promote JS minifiers and document their performances
3. To encourage healthy competition and improvement amongst minifiers

👟 Methodology

• Each minifier is executed in its own process with a 10s timeout
• Artifact integrity is verified by a test before and after minification
• Each minifier is minimally configured (sourcemaps & comments disabled), comparing out-of-the-box experience
• Minifier upgrade PRs are automated via WhiteSource Renovate
• Benchmarks are updated on every PR via GitHub Actions
• The raw benchmark data is available in /packages/data/data/data.json

⏱ Metrics

Minifiers are ranked by smallest minzipped size.

Minified size

Size of the minified output.

Minzipped size

Size of the minified output with Gzip compression.

For minifiers, this measures how compressable the output is.

For users, this measures network transfer size, which is usually the metric that matters most.

Time

How long minification took (average of 5 runs). Each time is annotated with a multiplier relative to the fastest minifier.

📋 Results

[!TIP]
What’s the verdict? ⚔️ See the Minifier showdown

---
config:
    xyChart:
        width: 720
        height: 360
        xAxis:
            labelPadding: 20
        yAxis:
            labelPadding: 10
---
xychart-beta
    title "react v17.0.2"
    x-axis ["Original",1,2,3,4,5,6,7,8,9,10,11,12]
    y-axis "Gzip size" 0 --> 19385
    bar [19385,8177,8186,8193,8265,8448,8493,8543,8628,8661,8668,8746,11040]

---
config:
    xyChart:
        width: 720
        height: 360
        xAxis:
            labelPadding: 20
        yAxis:
            labelPadding: 10
---
xychart-beta
    title "moment v2.29.1"
    x-axis ["Original",1,2,3,4,5,6,7,8,9,10,11,12]
    y-axis "Gzip size" 0 --> 36231
    bar [36231,18568,18690,18746,18910,19119,19260,19334,19478,19569,19683,19857,24998]

---
config:
    xyChart:
        width: 720
        height: 360
        xAxis:
            labelPadding: 20
        yAxis:
            labelPadding: 10
---
xychart-beta
    title "jquery v3.5.1"
    x-axis ["Original",1,2,3,4,5,6,7,8,9,10,11,12]
    y-axis "Gzip size" 0 --> 84498
    bar [84498,30866,30903,30912,30969,31446,31470,31621,31799,31954,32653,33086,40879]

---
config:
    xyChart:
        width: 720
        height: 360
        xAxis:
            labelPadding: 20
        yAxis:
            labelPadding: 10
---
xychart-beta
    title "vue v2.6.12"
    x-axis ["Original",1,2,3,4,5,6,7,8,9,10,11,12]
    y-axis "Gzip size" 0 --> 89668
    bar [89668,42727,42919,43036,43357,43925,44230,44358,44368,44450,44679,45400,57169]

---
config:
    xyChart:
        width: 720
        height: 360
        xAxis:
            labelPadding: 20
        yAxis:
            labelPadding: 10
---
xychart-beta
    title "lodash v4.17.21"
    x-axis ["Original",1,2,3,4,5,6,7,8,9,10,11,12]
    y-axis "Gzip size" 0 --> 96690
    bar [96690,24686,24972,25186,25240,25503,25862,25979,26200,26221,26498,26655,36327]

---
config:
    xyChart:
        width: 720
        height: 360
        xAxis:
            labelPadding: 20
        yAxis:
            labelPadding: 10
---
xychart-beta
    title "d3 v6.3.1"
    x-axis ["Original",1,2,3,4,5,6,7,8,9,10]
    y-axis "Gzip size" 0 --> 130686
    bar [130686,87016,87205,88087,88148,88319,89156,89882,90800,92395,94121]

---
config:
    xyChart:
        width: 720
        height: 360
        xAxis:
            labelPadding: 20
        yAxis:
            labelPadding: 10
---
xychart-beta
    title "terser v5.30.3"
    x-axis ["Original",1,2,3,4,5,6,7,8,9,10,11]
    y-axis "Gzip size" 0 --> 193763
    bar [193763,122353,123291,123334,123482,124428,124609,124885,126562,126707,127653,145178]

---
config:
    xyChart:
        width: 720
        height: 360
        xAxis:
            labelPadding: 20
        yAxis:
            labelPadding: 10
---
xychart-beta
    title "three v0.124.0"
    x-axis ["Original",1,2,3,4,5,6,7,8,9,10,11]
    y-axis "Gzip size" 0 --> 248267
    bar [248267,158764,159071,159198,160827,162998,163036,163198,163725,164610,166210,193471]

---
config:
    xyChart:
        width: 720
        height: 360
        xAxis:
            labelPadding: 20
        yAxis:
            labelPadding: 10
---
xychart-beta
    title "victory v35.8.4"
    x-axis ["Original",1,2,3,4,5,6,7,8,9]
    y-axis "Gzip size" 0 --> 309942
    bar [309942,157435,157843,158706,162248,165014,166386,167579,181071,182671]

---
config:
    xyChart:
        width: 720
        height: 360
        xAxis:
            labelPadding: 20
        yAxis:
            labelPadding: 10
---
xychart-beta
    title "echarts v5.1.1"
    x-axis ["Original",1,2,3,4,5,6,7,8]
    y-axis "Gzip size" 0 --> 684611
    bar [684611,321255,321987,324608,330736,331412,331563,331847,337934]

---
config:
    xyChart:
        width: 720
        height: 360
        xAxis:
            labelPadding: 20
        yAxis:
            labelPadding: 10
---
xychart-beta
    title "antd v4.16.1"
    x-axis ["Original",1,2,3,4,5,6,7,8]
    y-axis "Gzip size" 0 --> 825175
    bar [825175,452477,457786,463332,471791,475480,478572,488279,491833]

---
config:
    xyChart:
        width: 720
        height: 360
        xAxis:
            labelPadding: 20
        yAxis:
            labelPadding: 10
---
xychart-beta
    title "typescript v4.9.5"
    x-axis ["Original",1,2,3,4,5,6]
    y-axis "Gzip size" 0 --> 1884998
    bar [1884998,859199,860657,875817,876535,879301,915551]

Artifact	Original size	Gzip size
typescript v4.9.5 (typescript@4.9.5/lib/typescript.js">Source)	10.95 MB	1.88 MB
Minifier	Minified size	Minzipped size	Time
1. @swc/core	🏆-70% 3.31 MB	🏆-54% 859.20 kB	8x 2,177 ms
2. oxc-minify	-69% 3.35 MB	-54% 860.66 kB	1x 423 ms
3. @tdewolff/minify	-69% 3.35 MB	-54% 875.82 kB	🏆 264 ms
4. uglify-js (no compress)	-68% 3.54 MB	-53% 876.54 kB	15x 4,029 ms
5. terser (no compress)	-68% 3.53 MB	-53% 879.30 kB	20x 5,318 ms
6. esbuild	-68% 3.49 MB	-51% 915.55 kB	1x 490 ms
7. terser ❌ Timed out	-	-	+10,000 ms
8. babel-minify ❌ Timed out	-	-	+10,000 ms
9. google-closure-compiler ❌ Timed out	-	-	+10,000 ms
10. uglify-js ❌ Timed out	-	-	+10,000 ms
11. tedivm/jshrink ❌ Timed out	-	-	+10,000 ms
12. bun ❌ Post-validation	❌	❌	-

⚔️ Minifier showdown

[!NOTE]
🤖 This analysis is AI generated

Woah, what a race! It’s been an electric showdown between the heavy hitters in the realm of JavaScript minifiers. With compression rates and processing speeds on the line, it’s time to crown the victor and analyze the knockouts. Without further ado, let’s dive into the results.

Best minifier

💥 @swc/core takes the crown for the average user! Balancing impeccable compression ratios and breathtaking speed, SWC repeatedly came out near the top. While it didn’t win every round, its performance was dazzling, especially for larger files like antd and typescript. For instance, it flattened the enormous 1.88 MB typescript package to 859.20 kB (46%) in just 2,177 ms, a brilliant feat. This suggests SWC consistently delivers fantastic results with both small and massive files. It’s the minifier to bet on for those looking for reliable compression and swift execution.

Honorable mentions

• Ugly-yet-effective Production Workhorse: uglify-js
  Despite its cranky processing times that bordered on a timeout in some rounds (hello, antd!), uglify-js was an absolute champion at squeezing the smallest possible size for multiple files. Take the lodash package: 24.69 kB (26%) in 1,689 ms—a clear finish over the competition. For those willing to trade time for size dedication, uglify-js is your faithful servant.

• Young and Speedy: oxc-minify
  Coming in hot, oxc-minify performed blisteringly fast in nearly every round while keeping size reductions respectable. It sped through lodash in 12 ms and terser in 38 ms but without quite achieving the size reductions of uglify or SWC. Nonetheless, it’s the sprinter of this competition, excelling at zipping through your code with fantastic efficiency.

• Tactical Leader: @tdewolff/minify
  If raw speed is your only metric, @tdewolff/minify will dazzle you! For example, it demolished three in just 51 ms (though it was a bit chunkier at 164.61 kB compared to SWC’s 158.76 kB). Super-slick for real-time pipelines where execution time takes precedence over file size.

• esbuild
  A solid performer among the compact-size group, esbuild offers speedy reductions but doesn’t punch the same weight as top-notch minifiers above. However, with its simple API and competitive processing of smaller packages, it’s worth considering for light workloads.

Eliminated

• babel-minify: Unfortunately, this minifier tripped on d3 due to a runtime error, thus crashing out of our competition. Proceed with caution—its development seems stagnant compared to its competitors. Not for the faint of heart!

• tedivm/jshrink: Ouch! An unclosed regex pattern on d3 made this minifier wave the white flag. While not necessarily a lightweight entrant, reliability issues keep it from competing seriously.

• bun: This up-and-comer couldn’t hold up to the rigors of JS minification, failing the post-validation stage on typescript. Definitely unstable for production use right now.

Quick outro

Wow, what an exhilarating display of compression power and speed finesse! While @swc/core emerges as the undeniable superstar of this tournament with its consistent all-around performance, our honorable mentions prove that there’s more than one path to minification glory. Huge respect to all participants for putting up an impressive fight—their efforts will leave JavaScript developers spoiled for choice. Stay tuned for the next championship!

Sponsors