Lightning CSS 1.33.0 vs PostCSS 8.5.29 + Autoprefixer 10.6.1 + cssnano 6.1.2 on a 76,864-byte CSS fixture: medians 3.16 ms vs 105.75 ms (~33x). Outputs 70498 vs 68474 B. Leave Autoprefixer+cssnano-only stacks for Lightning; keep PostCSS for plugins Lightning does not replace.
4 min read
On a 77 KB CSS fixture (80 generated card stylesheets flattened into one file), Lightning CSS 1.33.0 took a median 3.2 ms to minify with vendor targets. PostCSS 8.5.29 with Autoprefixer 10.6.1 and cssnano 6.1.2 took 106 ms. Same machine, same input, library APIs for each pipeline.
Short answer: leave a PostCSS Autoprefixer + cssnano stack for Lightning CSS if your CSS is modern enough for Lightning's targets and you want the minify+prefix job in a few milliseconds. Keep PostCSS when you depend on PostCSS plugins Lightning does not replace. No affiliate links in this post.
.card-N stylesheets with flex/grid, gradients, user-select, appearance, backdrop-filter, color-mix, container queries, and media queries, concatenated to fixture.css (76,864 bytes). No Sass, no Tailwind, no CSS Modules.lightningcss 1.33.0 (transform with minify: true, targets chrome 90 / firefox 90 / safari 14). PostCSS 8.5.29 + autoprefixer 10.6.1 (> 0.5%, last 2 versions, not dead) + cssnano 6.1.2 (preset: 'default').-webkit- hits on this fixture (240) while PostCSS added -moz-appearance pairs (160 moz / 160 webkit counted). Speed is not the only diff.@import resolve on many files, source maps, visual regression, Windows/macOS, Vite css.transformer switch on a real app.| Pipeline | Median | Runs (ms) | Output bytes |
|---|---|---|---|
| Lightning CSS 1.33.0 | 3.2 ms | 3.5 / 3.0 / 3.2 / 3.0 / 3.2 | 70,498 |
| PostCSS 8 + Autoprefixer + cssnano 6 | 106 ms | 134 / 107 / 106 / 103 / 94 | 68,474 |
On this fixture Lightning CSS was about 33x faster than the PostCSS Autoprefixer + cssnano path. PostCSS still won raw size by about 2 KB. If your CI CSS step is already under 100 ms, the absolute win is small; if you run PostCSS on large design-system CSS repeatedly, the multiplier matters.
For browser-facing CSS changes on this site, see the Chrome 155 CSS notes and the Firefox 157 CSS notes. Those are browser releases, not toolchain switches; this post is the build-pipeline decision.
PostCSS is a plugin host. Autoprefixer + cssnano is only one common pair. Teams that rely on postcss-preset-env, custom polyfills, CSS Modules transforms, or design-token plugins may have no Lightning drop-in. Lightning CSS covers nesting, minification, and many prefix targets, but it is not a PostCSS-compatible plugin runner.
Also match the CSS tool to the bundler. Vite can use Lightning CSS as the transformer; other stacks still wire PostCSS by default. Swapping only minify while leaving a long PostCSS plugin list elsewhere does not remove the slow path. The Vite 8.3.2 post is the closer next step if your app is Vite-first.
| Situation | My pick |
|---|---|
| PostCSS is only Autoprefixer + cssnano for production CSS | Prefer Lightning CSS; re-time CI |
| Already on Vite with Lightning CSS enabled | Stay; do not add a second PostCSS minify pass |
| You need PostCSS plugins Lightning does not replace | Keep PostCSS for those files; split the pipeline if needed |
| You care more about smallest bytes than build time | Compare both outputs (and gzip); PostCSS was slightly smaller here |
| Large Sass or Tailwind-specific PostCSS chain | Measure that chain; this fixture was plain CSS |
Bottom line: on a 77 KB CSS fixture, Lightning CSS took 3.2 ms and PostCSS + Autoprefixer + cssnano took 106 ms. Who should not switch yet: teams blocked on PostCSS-only plugins. Everyone else still running Autoprefixer + cssnano as the whole pipeline should measure their own CSS the same way before rewriting the config.
How this was made: I generated the stylesheets, ran both pipelines on the ShopperCove test box, and kept the timing JSON; the write-up was drafted with AI help and checked against that output.
Lab evidence
Hands-on on ShopperCove box 5 Oct 2026 ~23:05-23:15 IST (8 vCPU Intel Xeon / 15 GB shared Linux, Node 20.19.2). Fixture: 80 synthetic card CSS files flattened to fixture.css (76864 bytes) with flex/grid, gradients, user-select, appearance, backdrop-filter, color-mix, container queries. Versions: lightningcss 1.33.0 (transform minify true, targets chrome 90 / firefox 90 / safari 14); postcss 8.5.29 + autoprefixer 10.6.1 (>0.5%, last 2 versions, not dead) + cssnano 6.1.2 default preset. Wall medians (5 interleaved after warmup): Lightning CSS 3.160 ms (3.468/2.986/3.160/2.972/3.239); PostCSS stack 105.752 ms (133.693/106.565/105.752/102.629/94.267). Output bytes: Lightning 70498; PostCSS 68474. Prefix counts on outputs: Lightning webkit 240 / moz 0; PostCSS webkit 160 / moz 160. Raw: /workspace/bench-css/res-css.json. Not tested: Sass/Less, Tailwind, other PostCSS plugins, Lightning multi-file @import bundling, source maps, visual regression, Windows/macOS, real Vite css.transformer migrate. No affiliate.
svgo 4.1.0 vs @svgr/core 8.1.0 on 20 verbose 128×128 SVGs (18,990 B). Warm medians (7 rounds after 1 warm-up): SVGO 34 ms / 12,410 B; SVGR JSX 35 ms / 17,620 B; SVGR+plugin-svgo 63 ms / 12,920 B. Fixture /workspace/bench-svgo-svgr/.
Hands-on6 Oct 20264 min read
Terser 5.51.2 vs esbuild 0.28.2 vs SWC 1.16.13 minify on a 403,418-byte unminified ESM bundle (800 modules): medians 824 ms / 41 ms / 70 ms. Output sizes 219492 / 207619 / 199712 B. Leave Terser if you only need fast minify; keep it for Terser-only compress options.
Summary5 Oct 20265 min read
Hands-on6 Oct 20268 min read