ChristianMurphy / postcss-combine-duplicated-selectors

automatically keep css selectors unique.
MIT License
96 stars 11 forks source link

This plugin with `removeDuplicatedProperties: true` makes postcss pipeline in astro hang when importing open-props.min.css #1064

Open T3sT3ro opened 10 months ago

T3sT3ro commented 10 months ago

I have an astro project with a global.css style. Inside, I import an open-props css file like so:

@import url("../../node_modules/open-props/open-props.min.css");

My postcss.config.cjs as this configuration:

require('postcss-combine-duplicated-selectors')({
   removeDuplicatedProperties: true,
   removeDuplicatedValues: false
}), ...

When I try to boot astro with pnpm astro dev, the "transform" process of the global.css hangs for 60 or so seconds due to the inclusion of the open-props.min.css and transformation with this plugin. Without removeDuplicatedProperties: true the boot process of astro is blazing fast.

ChristianMurphy commented 10 months ago

Welcome @T3sT3ro! 👋 Would you be willing to try out, and potentially add a test case or benchmark for https://github.com/ChristianMurphy/postcss-combine-duplicated-selectors/pull/852 ? It has a potential fix but has been stalled for a while.

T3sT3ro commented 10 months ago

I'm attaching a stackblitz approximating what my site setup looks like. The slow astro boot process is clearly visible and can be tested when you comment-out the @import url(...open-props.min.css) inside src/styles/theme-light.css. The relevant delay is seen after the message "watching for file changes..." displays in the console. Without this line commented, the time before you see a page is around a minute, while the commented one takes only few seconds. Unfortunately I don't have the time to contribute beside this sample project demonstrating the issue (the issue might be more complex, because there is also a postcss import plugin, irrc for inlining content):

https://stackblitz.com/edit/github-l2p7hw?file=src%2Fstyles%2Ftheme-light.css

to run it and test how slow the boot is: pnpm astro dev to get insights into astro boot, the timing of the style transformations etc: pnpm astro dev --verbose