pandacss-preset-radix-colors icon indicating copy to clipboard operation
pandacss-preset-radix-colors copied to clipboard

This package wildly slows down the dev experience for panda CSS.

Open iyifr opened this issue 1 year ago • 3 comments

This causes a non-trivial increase in compile times in development. Any idea why ?

iyifr avatar Feb 10 '24 15:02 iyifr

Make sure you provide the colorScales property to the preset to only include the colors that you use. That should greatly improve compile times. Also try out using lightningcss by setting lightningcss to true in your panda.config.ts.

milandekruijf avatar Feb 10 '24 15:02 milandekruijf

Afaik, PandaCSS doesn't actually detect what variables you use so everything will be included. I don't know the exact numbers of variables that are created but I am sure it's in the thousands if all color scales are included.

milandekruijf avatar Feb 10 '24 15:02 milandekruijf

Yeah, it's a lot of variables when you include all colors which is rarely needed. You could force the consumer to specify if they want to use all colors and mention that it will degrade performance significantly if they do in the docs. The compile times greatly improve as mentioned.

iyifr avatar Feb 11 '24 08:02 iyifr