Build performance issue since TailwindCSS 3.4.8

[FrancescoBorzi]

What version of Tailwind CSS are you using?

I tried 3.4.8, 3.4.9 and 3.4.10 - they all have the same problem.

It works fine until 3.4.7

What 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 tailwindcss from version 3.4.7 to version 3.4.8 or newer.

Something released in version 3.4.8 is causing a huge performance regression.

[adamwathan]

Hey! Can you share a project that reproduces this so we can look into it?

[Phhansen]

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.
Only two apps were affected by this.

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 cssnano dependency update related to css nesting. Again, this is just on top of my head and it might be something else or a combination, but good place to start.

[Francesco-Borzi]

@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.

[adamwathan]

Would be it a possibility if I grant access to you and other members of the Tailwind team to such a private repository?

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.

[Francesco-Borzi]

Would be it a possibility if I grant access to you and other members of the Tailwind team to such a private repository?

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

[iuliust]

Hey there. I can confirm this issue since 3.4.8. Same conclusion.
Unfortunately, I too have this problem on a sensitive private repo that's not even hosted on github (sorry).
Nevertheless, what I can say is that this repo was greatly inspired by ngx-bootstrap's structure.

[adamwathan]

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.

[Alex-2801]

We habe the same Issue here.
We have a big Nx Monorepo with round about 500 Libs and two Angular 17 applications.
Same problem as described, after updating to 3.4.8 our build and serve times nearly doubled from 110sec to 200sec.
Retested today with current version 3.4.12 but its also slow.

(edit)
3.4.13 solved it 🎉

[RobinMalfait]

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 npm install tailwindcss@insiders, this should install tailwindcss@0.0.0-insiders.066ccf8.

[RobinMalfait]

This has now been published in the next release as well. You can use npm install tailwindcss@latest to upgrade.

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.

[iuliust]

@RobinMalfait That's so great! Thanks so much for your work.