fix(colormin,minify-gradients): replace colord with @colordx/core, fix lossy color minification (#1515)#1755
Conversation
|
Seems TypeScript cannot see the types from colordx |
|
I've updated to the latest TypeScript and changed |
I'll check on my side |
650f084 to
e6f0594
Compare
…x lossy color minification
e6f0594 to
cbac5e6
Compare
|
Now the test is probably failing because the color minification output is different in the integration tests. |
…options, modern formats
Thanks. I've updated snapshots and added more tests to make sure there is no regression |
| "repository": "cssnano/cssnano", | ||
| "dependencies": { | ||
| "colord": "^2.9.3", | ||
| "@colordx/core": "^2.0.1", |
There was a problem hiding this comment.
Should we upgrade to 4.x before merging?
|
If I upgrade to |
…or format support
Yes, I've pushed new commit. Basically, I moved some code in plugin to improve bundle size |
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## master #1755 +/- ##
==========================================
- Coverage 98.83% 98.82% -0.02%
==========================================
Files 124 124
Lines 10592 10776 +184
Branches 15 15
==========================================
+ Hits 10469 10649 +180
- Misses 123 127 +4 ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
|
@ludofischer thanks! When do you plan to release a new version? |
|
@dkryaklin should be up at any moment now on npm |
Problem
postcss-colorminusedcolordto minify CSS color values.colordrounds color values to integers at parse time, so HSL conversions accumulate rounding error — making some RGB → HSL round-trips lossy:This caused visible color seams at image/UI boundaries.
Real-world impact:
colordalso returnsisValid: falseforoklch(),oklab(),hwb(), and other modern CSS color formats, so gradient color stops using these formats were not recognised bypostcss-minify-gradients.colordhas not received any updates since August 2022.Solution
Replace
colordwith@colordx/core, its actively maintained successor with an intentionally compatible API.colordxstores color values as floats internally — no rounding at parse time. This preserves exact precision through conversions so the minifier always picks the shortest truly lossless representation:With this fix, Next.js could re-enable colormin and recover the minification savings they gave up.
Changes
postcss-colormin: swapcolord→@colordx/core@^2.0.1postcss-minify-gradients: swapcolord→@colordx/core@^2.0.1Additional improvements
oklch(),oklab(), andhwb()values within the sRGB gamut are now correctly minified bypostcss-colormin(previously passed through unchanged)postcss-minify-gradientsTesting
oklch,oklab,hwb,lch,color()in both packagespostcss-colorminunit tests passingpostcss-colorminintegration tests passingpostcss-minify-gradientstests passingFixes #1515