From 2ddb47d2b0251c940c06a4236e12662ad130db69 Mon Sep 17 00:00:00 2001 From: Romain Menke Date: Fri, 8 Sep 2023 22:58:39 +0200 Subject: [PATCH] add @csstools/postcss-minify --- README.md | 1 + docs/index.html | 230 ++++++++++++++++++++++++---------------------- lib/minify.js | 9 +- package-lock.json | 60 ++++++++++++ package.json | 1 + 5 files changed, 192 insertions(+), 109 deletions(-) diff --git a/README.md b/README.md index 364551d..d7b91bf 100644 --- a/README.md +++ b/README.md @@ -12,6 +12,7 @@ A comparison of CSS minification engines. * [cssnano](https://github.com/ben-eb/cssnano) * [csso](https://github.com/css/csso) * [esbuild](https://github.com/evanw/esbuild) +* [@csstools/postcss-minify](https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-minify) ### How can I see the results? diff --git a/docs/index.html b/docs/index.html index 66ad369..d63239f 100644 --- a/docs/index.html +++ b/docs/index.html @@ -26,161 +26,175 @@

CSS Minification Benchmark

csso (restructure off) - 5.0.2 esbuild - 0.14.11 @parcel/css - 1.0.1 +@csstools/postcss-minify - 1.0.0 960.css - 9989 bytes -5772 bytes
19.48 ms -5772 bytes
22.19 ms -5772 bytes
453.86 ms -5772 bytes
133.09 ms -5768 bytes
25.8 ms -5772 bytes
5.2 ms -5773 bytes
71.47 ms -5772 bytes
1.49 ms +5772 bytes
8.29 ms +5772 bytes
7.13 ms +5772 bytes
163.89 ms +5772 bytes
59.05 ms +5768 bytes
15.55 ms +5772 bytes
1.91 ms +5773 bytes
30.64 ms +5772 bytes
0.41 ms +5939 bytes
4.05 ms animate.css - 95374 bytes -75274 bytes
80.83 ms -74510 bytes
96.91 ms -71723 bytes
163.69 ms -45487 bytes
159.71 ms -73220 bytes
116.63 ms -74520 bytes
64.28 ms -71865 bytes
11.6 ms -67675 bytes
3.36 ms +75274 bytes
36.17 ms +74510 bytes
44.7 ms +71723 bytes
76.46 ms +45487 bytes
78.92 ms +73220 bytes
39.08 ms +74520 bytes
17.65 ms +71865 bytes
6.23 ms +67675 bytes
2.33 ms +78245 bytes
9.85 ms blueprint.css - 17422 bytes -10796 bytes
17.3 ms -10646 bytes
46.81 ms -10696 bytes
80.71 ms -10696 bytes
71.78 ms -10677 bytes
28.62 ms -10760 bytes
8.32 ms -10778 bytes
1.88 ms -10760 bytes
1.04 ms +10796 bytes
8.78 ms +10646 bytes
16 ms +10696 bytes
33.52 ms +10696 bytes
24.23 ms +10677 bytes
17.35 ms +10760 bytes
3.08 ms +10778 bytes
11.03 ms +10760 bytes
1.27 ms +11074 bytes
2.32 ms bootstrap-4.css - 200078 bytes -161971 bytes
111.84 ms -159896 bytes
228.21 ms -160380 bytes
503.11 ms -147131 bytes
385.31 ms -160157 bytes
167.38 ms -161962 bytes
62.29 ms -160913 bytes
17.49 ms -154436 bytes
8.78 ms +161971 bytes
65.9 ms +159896 bytes
99.73 ms +160380 bytes
205.5 ms +147131 bytes
161.39 ms +160157 bytes
71.91 ms +161962 bytes
25.43 ms +160913 bytes
10.34 ms +154436 bytes
4.5 ms +165538 bytes
29.14 ms bootstrap-5.css - 205481 bytes -163824 bytes
122.55 ms -161691 bytes
166.77 ms -162285 bytes
341.85 ms -161473 bytes
339.7 ms -161483 bytes
108.37 ms -163830 bytes
38.65 ms -163143 bytes
22.02 ms -160889 bytes
8.01 ms +163824 bytes
62.63 ms +161691 bytes
66.63 ms +162285 bytes
175.12 ms +161473 bytes
173.64 ms +161483 bytes
49.25 ms +163830 bytes
17.96 ms +163143 bytes
10.47 ms +160889 bytes
5.06 ms +166940 bytes
22.02 ms font-awesome-all.css - 73117 bytes -58568 bytes
18.69 ms -58568 bytes
31.29 ms -58929 bytes
123.73 ms -58563 bytes
127.14 ms -53128 bytes
38.86 ms -53184 bytes
17.79 ms -58980 bytes
5.56 ms -58791 bytes
2.66 ms +58568 bytes
11.06 ms +58568 bytes
14.79 ms +58929 bytes
60.51 ms +58563 bytes
70.14 ms +53128 bytes
19.25 ms +53184 bytes
8.61 ms +58980 bytes
4.77 ms +58791 bytes
2.11 ms +59081 bytes
5.46 ms foundation.css - 168014 bytes -132603 bytes
96.71 ms -125186 bytes
93.19 ms -126470 bytes
277.04 ms -107261 bytes
259.38 ms -124232 bytes
80.54 ms -132554 bytes
28.87 ms -131891 bytes
12.83 ms -124579 bytes
5.23 ms +132603 bytes
54.61 ms +125186 bytes
49.82 ms +126470 bytes
128.96 ms +107261 bytes
133.87 ms +124232 bytes
43 ms +132554 bytes
16.4 ms +131891 bytes
9.16 ms +124579 bytes
4.31 ms +136012 bytes
16.46 ms inuit.css - 53050 bytes -18184 bytes
12.46 ms -17635 bytes
19.58 ms -18105 bytes
87.4 ms -17961 bytes
57.64 ms -17878 bytes
23.9 ms -18216 bytes
7.46 ms -18325 bytes
2.93 ms -17948 bytes
1.15 ms +18184 bytes
19.08 ms +17635 bytes
23.32 ms +18105 bytes
24.01 ms +17961 bytes
22.02 ms +17878 bytes
11.46 ms +18216 bytes
3.29 ms +18325 bytes
2.46 ms +17948 bytes
0.9 ms +20320 bytes
3.08 ms normalize.css - 6138 bytes -1815 bytes
1.6 ms -1742 bytes
2.4 ms -1802 bytes
10.51 ms -1802 bytes
7.24 ms -1692 bytes
1.79 ms -1816 bytes
0.98 ms -1816 bytes
0.97 ms -1704 bytes
0.24 ms +1815 bytes
0.69 ms +1742 bytes
2 ms +1802 bytes
3.04 ms +1802 bytes
3.33 ms +1692 bytes
1.01 ms +1816 bytes
0.36 ms +1816 bytes
1.24 ms +1704 bytes
0.21 ms +1875 bytes
0.43 ms pure.css - 28843 bytes -16797 bytes
8.24 ms -16500 bytes
13.93 ms -16660 bytes
48.28 ms -15986 bytes
48.22 ms -16733 bytes
13.01 ms -16780 bytes
5.4 ms -16773 bytes
3.65 ms -16267 bytes
0.9 ms +16797 bytes
4.14 ms +16500 bytes
7.97 ms +16660 bytes
21.89 ms +15986 bytes
22 ms +16733 bytes
5.74 ms +16780 bytes
2.27 ms +16773 bytes
1.61 ms +16267 bytes
0.72 ms +17380 bytes
3.58 ms reset.css - 1092 bytes -773 bytes
0.53 ms -773 bytes
0.96 ms -773 bytes
2.85 ms -773 bytes
3 ms -747 bytes
1.59 ms -773 bytes
0.3 ms -774 bytes
0.7 ms -773 bytes
0.16 ms +773 bytes
0.28 ms +773 bytes
0.49 ms +773 bytes
1.47 ms +773 bytes
1.51 ms +747 bytes
0.92 ms +773 bytes
0.16 ms +774 bytes
0.56 ms +773 bytes
0.12 ms +969 bytes
0.19 ms tailwind.css - 2380419 bytes -1941795 bytes
974.56 ms -1941490 bytes
931.06 ms -1925626 bytes
3136.25 ms -1787893 bytes
3146.95 ms -1652840 bytes
719.28 ms -1944385 bytes
346.11 ms -1961295 bytes
371.86 ms -1960722 bytes
86.56 ms +1941795 bytes
430.19 ms +1941490 bytes
500.54 ms +1925626 bytes
1551.81 ms +1787893 bytes
1711.37 ms +1652840 bytes
416.36 ms +1944385 bytes
184.91 ms +1961295 bytes
98.58 ms +1960722 bytes
37.86 ms +1999094 bytes
153.1 ms Total - 3239017 bytes -2588172 bytes
1464.79 ms -2574409 bytes
1653.3 ms -2559221 bytes
5229.28 ms -2360798 bytes
4739.16 ms -2278555 bytes
1325.77 ms -2584552 bytes
585.65 ms -2602326 bytes
522.96 ms -2580316 bytes
119.58 ms +2588172 bytes
701.82 ms +2574409 bytes
833.12 ms +2559221 bytes
2446.18 ms +2360798 bytes
2461.47 ms +2278555 bytes
690.88 ms +2584552 bytes
282.03 ms +2602326 bytes
187.09 ms +2580316 bytes
59.8 ms +2662467 bytes
249.68 ms

Benchmark info:

- 
Date: Thu, 13 Jan 2022 19:46:58 GMT
-CPU: Intel(R) Core(TM) i7-7700K CPU @ 4.20GHz
-OS: Linux x64 4.4.0-19041-Microsoft
-Node.js: v16.13.2
+ 
Date: Fri, 08 Sep 2023 20:55:09 GMT
+CPU: Apple M2
+OS: Darwin arm64 22.6.0
+Node.js: v20.4.0
diff --git a/lib/minify.js b/lib/minify.js index ef5e319..2e07094 100644 --- a/lib/minify.js +++ b/lib/minify.js @@ -5,6 +5,7 @@ const path = require('path'); const process = require('process'); const { Buffer } = require('buffer'); const Q = require('q'); +const postcss = require('postcss'); const CleanCSS = require('clean-css'); const cssnano = require('cssnano'); @@ -12,6 +13,7 @@ const csso = require('csso'); const gzipSize = require('gzip-size'); const esbuild = require('esbuild'); const parcelCss = require('@parcel/css'); +const postcssMinify = require('@csstools/postcss-minify'); // MINIFIERS const minifiers = { @@ -42,7 +44,12 @@ const minifiers = { }, '@parcel/css': source => { return parcelCss.transform({ filename: '', code: Buffer.from(source), minify: true }).code; - } + }, + '@csstools/postcss-minify': source => { + return postcss([postcssMinify()]).process(source, { from: undefined }).then(result => { + return result.css; + }); + }, }; const gzippedSize = {}; diff --git a/package-lock.json b/package-lock.json index 389bf8f..ae7ae51 100644 --- a/package-lock.json +++ b/package-lock.json @@ -12,6 +12,7 @@ "css-minification-benchmark": "bin/bench.js" }, "devDependencies": { + "@csstools/postcss-minify": "^1.0.0", "@parcel/css": "^1.0.1", "clean-css": "^5.2.2", "cssnano": "^5.0.15", @@ -497,6 +498,50 @@ "node": ">=6.9.0" } }, + "node_modules/@csstools/css-tokenizer": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/@csstools/css-tokenizer/-/css-tokenizer-2.2.0.tgz", + "integrity": "sha512-wErmsWCbsmig8sQKkM6pFhr/oPha1bHfvxsUY5CYSQxwyhA9Ulrs8EqCgClhg4Tgg2XapVstGqSVcz0xOYizZA==", + "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/csstools" + }, + { + "type": "opencollective", + "url": "https://opencollective.com/csstools" + } + ], + "engines": { + "node": "^14 || ^16 || >=18" + } + }, + "node_modules/@csstools/postcss-minify": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/@csstools/postcss-minify/-/postcss-minify-1.0.0.tgz", + "integrity": "sha512-gM0ES6+YsXqiqnute1yxrSnp8veYVGOHq1jeedgMdTZOvCX8ueUU/ytdXsopZuKO/jvHP/LlUIfYOj569nJnyg==", + "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/csstools" + }, + { + "type": "opencollective", + "url": "https://opencollective.com/csstools" + } + ], + "dependencies": { + "@csstools/css-tokenizer": "^2.1.1" + }, + "engines": { + "node": "^14 || ^16 || >=18" + }, + "peerDependencies": { + "postcss": "^8.4" + } + }, "node_modules/@eslint/eslintrc": { "version": "1.0.5", "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-1.0.5.tgz", @@ -8083,6 +8128,21 @@ "to-fast-properties": "^2.0.0" } }, + "@csstools/css-tokenizer": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/@csstools/css-tokenizer/-/css-tokenizer-2.2.0.tgz", + "integrity": "sha512-wErmsWCbsmig8sQKkM6pFhr/oPha1bHfvxsUY5CYSQxwyhA9Ulrs8EqCgClhg4Tgg2XapVstGqSVcz0xOYizZA==", + "dev": true + }, + "@csstools/postcss-minify": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/@csstools/postcss-minify/-/postcss-minify-1.0.0.tgz", + "integrity": "sha512-gM0ES6+YsXqiqnute1yxrSnp8veYVGOHq1jeedgMdTZOvCX8ueUU/ytdXsopZuKO/jvHP/LlUIfYOj569nJnyg==", + "dev": true, + "requires": { + "@csstools/css-tokenizer": "^2.1.1" + } + }, "@eslint/eslintrc": { "version": "1.0.5", "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-1.0.5.tgz", diff --git a/package.json b/package.json index 376a099..21f4eb6 100644 --- a/package.json +++ b/package.json @@ -31,6 +31,7 @@ "main": "lib/index.js", "dependencies": {}, "devDependencies": { + "@csstools/postcss-minify": "^1.0.0", "@parcel/css": "^1.0.1", "clean-css": "^5.2.2", "cssnano": "^5.0.15",