HTML & CSS minify

Is there some built in feature? Please advise.
It looks like Cloudflare doesn’t minify them anymore.

Django has no built in featre for minifying CSS or JS. Not quite sure how you would minify HTML to be honest.

You will need to look at other toolchains, but exactly which kind of depends on how you are handling things today (for example, I have tools which only take the bootstrap classes that are actually used in the project and creates a css file with only the necessary stuff, similar for js).

Most likely you are looking at setting up a node toolchain here …

Thank you for reply, michjnich! Cloudflare used to solve the minimize task for me before, but it looks like they stoped this feature.

I use tailwind css with Django (django-tailwind), and it’s docs say that If I use a framework I should ask at frameworks support forum. They add ‘-minify’ at the and of a command, but it doesn’t work with the command I use with Django (python3 manage.py tailwind build).

Any help?

As I say, there is nothing built into django to minify css. From the command example you give I’m guessing you’re using the django-tailwind package, which as far as I can see has no --minify option.

As I say, you likely need a node-based toolchain that you can point at your css files and which will output a minified file that you can then put in your static directory to serve to your users.

It is not something that is built into django though, because it’s entirely outside of anything to do with Django, which has no opinions on how you manage your css and js files, other than they need to be accessible via static when you serve them.

1 Like

Oh, and yes, it looks as though Cloudflare deprecated that feature in August:

https://community.cloudflare.com/t/deprecating-auto-minify/655677

1 Like

I’m a noob in all this things so “node-based toolchain” sounds Chinese to me. )
Do I understand it right that after build I can take a css file, run it through a css minify online cervice, replace an original file with this minified one and push to production server?

What I mean is that what you want to do is entirely out of scope for Django.

The “normal” way (or a common way at least) is to use JS tools installed via node to handle this, which is what I mean by “node-based toolchain”. There are multiple packages to minify css and js, rollup files etc, along with tutorials to do it for larger css frameworks like bootstrap and tailwind.

The manual process you describe would also work though:

  • Store your css file outside the standard static files directory so it doesn’t get collected by collectstatic.
  • Manually run it through some minifier tool and place the results in the static files directory, probably as file.min.css or something like that.
  • That will then get collected and you can use that filename in your templates.

Of course every time you change the “base” css file you will need to go through that manual process again or your changes won’t get deployed and served.

1 Like

You could use something like Django Compressor — Django Compressor 4.5.1 documentation to combine and compress CSS (and JS) files.

There are probably alternative similar solutions, and there are different ways to use compressor.

1 Like

Is there a specific reason why you want to minify your files? I think the main reason Cloudflare stopped minimising files is that it adds very little benefits, with the best performance improvements coming from compression instead. You could test this yourself by including both the minimised and un-minimised versions of your CSS and JS files and then using the dev tools in your browser to see the size of the file that was transferred over the network. The difference may be so little that it’s not worth minimising.