Build performance issue since TailwindCSS 3.4.8 #14353
Comments
|
Hey! Can you share a project that reproduces this so we can look into it? |
|
Today I also found out that this has been an issue for us over the last couple of days. @adamwathan I cannot share our repository since it's private, but we do run an nx mono repository with several apps. I'd love to do a test and dig deeper, but on the top of my head the only reason I can connect to this is that, for us, those two apps have more custom css, (so not just using tw util classes), and that custom css is using nesting. And looking at the TW 3.4.8 change I see a |
|
@adamwathan I need to check with management. Would be it a possibility if I grant access to you and other members of the Tailwind team to such a private repository? @Phhansen thanks for your feedback. |
Sure even better though would just be a public GitHub repo full of bogus content or whatever that just has a similar structure and reproduces the problem in a minimal way. |
yes... I know, but I'm not sure if I'm able to provide it |
|
Hey there. I can confirm this issue since 3.4.8. Same conclusion. |
|
Can anyone just create a fresh project with nonsense data in it that is structured however is necessary to reproduce the problem? I don't actually want to see anyone's real project, just the smallest thing possible that reproduces the issue. |
|
We habe the same Issue here. (edit) |
In a large project, it's costly to repeatedly call the
function `micromatch.isMatch` that parses a glob pattern,
creates a regular expression, and tests the path name
against the regular expression. To optimize performance,
it's important to cache the parsing and creating process
before entering the loop.
For example, the content configuration in a project
looks like this
`['./pages/**/*.{ts,js}', './node_modules/pages/**/*.{ts,js}']`.
If the project has 10000 matched files and 10 glob patterns,
the function `micromatch.isMatch` will be called 100000 times.
Fixes tailwindlabs#14353
|
Hey! Anyone running into this issue, can you install the following version of Tailwind CSS and verify if this solves the performance issues you are experiencing? Try using |
|
This has now been published in the next release as well. You can use If you are still running into issues after updating Tailwind CSS, make sure to open a new issue with a minimal reproduction repo attached so we can take a look. |
|
@RobinMalfait That's so great! Thanks so much for your work. |
|
Thanks for the heads up ❤️ |
|
Sadly, I haven't had the chance to test this yet but indeed thank you very much for providing a fix @RobinMalfait . Very much appreciated. |
What version of Tailwind CSS are you using?
I tried
3.4.8,3.4.9and3.4.10- they all have the same problem.It works fine until
3.4.7What build tool (or framework if it abstracts the build tool) are you using?
Angular 17 with NX 19
What version of Node.js are you using?
v20.17.0
What browser are you using?
It does not matter, it's a build issue.
What operating system are you using?
macOS
Reproduction URL
N/A
Describe your issue
Build times (both serving the app and recompiling after changes) become extremely slow when upgrading
tailwindcssfrom version3.4.7to version3.4.8or newer.Something released in version
3.4.8is causing a huge performance regression.The text was updated successfully, but these errors were encountered: