Server Side PurgeCSS

I have built my first site on Treepl using TailwindCSS and actually found it a better experience than expected. The only annoying thing I have found is that I need to download each rendered html page of the site to then run a PurgeCSS process to give me a smallest production CSS file I can use (the whole TailwindCSS file is over 4mb, end file was 52kb).

It would be amazing to have a PurgeCSS system in Treepl where it regenerates our css off the back of each page save or a manual “Purge CSS” button.

Thoughts?

1 Like

Hey @lachlanmunday. Welcome to the forum!
I’ve only heard about Tailwind so far. How does it relate to other frameworks like bootstrap? I heard from other devs that it needs some time to get used to it.
Any system that scales down files sizes are welcome in my world. If the team can implement that and still keep a priority on the big stuff, that would be great.
On another note, from a human resources perspective, I like any idea which makes Treepl even more attractive for developers and serves as argument to pull them over from the open source world.

Hi @lachlanmunday welcome to the forum.

For backlog requests to be considered they need go in the #public-backlog channel and follow the backlog format for the best chance of success.

I love more efficient code and serving smaller more optimized/compatible files.

That being said this feels pretty workflow specific, and my suggestion would be to integrate this into your local development workflow. I took a look and Purge CSS can be integrated into several task runners.

I personally use gulp for similar tasks and have my own files autoprefixed, converted to es5, transpiled from SCSS to css, minified etc etc and then uploaded on every save. I personally don’t use CSS frameworks very often, so having this integration wouldn’t necessarily benefit my personal workflow. Here is the documentation on integrating Purge CSS with Gulp.

However, perhaps it is the case that the majority of people are using small slices of large frameworks and the hunger for this feature is strong. The only way to find out is create the backlog request, advocate for it and see if the votes land on your feature.

May the odds be ever in your favor. :bow_and_arrow:

Hi @TimL - It did take a bit of getting used to but once I got into it I really liked it. It’s very flexible for creative control over your design without needing to write a CSS file. Mixing it with Alpine JS makes it a pretty nice little setup.

I am usually a Bootstrap guy but this has opened up another option to consider when planning out a site. You almost feel like your coding with inline styles, there is some argument that this is a downside of Tailwind but I actually found it a faster way to develop once I got used to the classes.

HI @Alex_B_Centrifuge, I use the CodeKit app to process things locally but I usually code Treepl sites via the browser so there is no local save process to initiate the Purge side of things. This is why I was hoping it could be considered as a feature in Treepl but I will investigate coding in VS Code instead (had some code stripping out when I did that a while ago).

1 Like

If it’s been a while since you’ve checked out VScode, it’s improved a lot. It really is my preferred editor by a long shot these days.

1 Like