Running out of memory with uncss

[oleersoy]

Hi - Just wanted to see if perhaps anyone had any thoughts on how we could improve computational and memory efficiency when running the uncss plugin. I did a writeup here:

https://stackoverflow.com/questions/46993217/streaming-css-through-postcss-uncss-plugin-in-order-to-minimize-buffer-usage

It's related to these two uncss issues:

• JavaScript heap out of memory uncss/uncss#339
• Uncss causes infinite loop uncss/uncss#319

[ai]

Any performance optimizations (including memory usage) must be started from benchmark.

So we need the exactly CSS file to reproduce error.

Then we need to run it by PostCSS alone and by PostCSS+uncss to understand the source of problem.

Of course, any full AST tool had a memory limits. But 7 MB of CSS should be processed in my opinion.

/cc @RyanZim

[oleersoy]

This description details one way to examine the issue:
uncss/uncss#319

Also if you try to run the deploy task for the repository that produces this test case you will also see it runs out of memory:
https://superflycss.github.io/utilities-icons/target/test/html/

Note the CSS file for the above test is 677,000 lines long.

git clone https://github.com/superflycss/utilities-icons
cd utilities-icons
npm i
npm run deploy

The only difference between npm run deploy and npm run build is that the former runs uncss also. Build outputs files to target and deploy outputs minimized css to a deploy directory.

[ai]

Thanks. Looks very useful.

Now step 2: run it by PostCSS and by PostCSS+uncss.

[oleersoy]

If you run npm run build it runs it without uncss. If you run npm run deploy it runs the build with uncss. The only difference is uncss. Thanks for your input on this BTW. Very much appreciated.

Also just FYI this is the build task. And this is the deploy task.

Also these are the directories that the build uses

[ai]

And we have "out of memory" problems in both cases, yeap?

[oleersoy]

Only when running npm run deploy. The build task (npm run build) which builds all the css runs fine. If you run npm run build you will see that all the css that is in src/main/css get built to target/main/css.

[ai]

So, seems like memory problems are only in uncss 😎

[oleersoy]

True - we just wanted to see if you could give us some pointers on how it might be resolved?

[ai]

I am not so good in memory debugging to really help uncss. But can remind common recommendation — disable feature by feature and check does it involve in the problem.

On your place I started from any parts, where you create cache/etc for CSS.

[oleersoy]

Sounds good - thansk - Looks like the only way is to do a deep dive.