You’re not allowed to make a performance argument like that unless you’re on some type of extremely limited embedded hardware or something. Especially when you are serving MBs of JavaScript. Gzip is good enough for over the wire size, and if parsing whitespace has got to be so close to free that it’s not going to be a problem. I say this from the top of my head, and it seems like the article back that up with data.
I don't have a stance on minifying CSS specifically, but extremely limited hardware is much more common than one might imagine. Billions of people exclusively access the internet through very under-powered and often old mobile phones with very limited bandwidth and monthly data quotas. I want my websites to work for them just as well as they do for people in wealthy countries.
Like many things, it depends on context. Using more CSS might be preferable when dealing with limited hardware if it means less cost elsewhere.
I once worked in front-end performance for a big ecommerce site and a common task that I dealt with was refactoring naive React implementations of interactive components (e.g dropdowns, accordions, etc) so that they relied more on CSS than JavaScript. In most cases the additional CSS was superior to the removed JavaScript, not in terms of weight but in runtime performance as measured by the profiler and less jank in low-tier mobile devices.
But also, no amount of asset minification is going to make the gargantuan SPAs that took over the web run well on an underpowered device, so it is a wash either way, IMHO.
Another class of devices are things like e-ink devices. You can be in the Western world and still be using an absolute toaster of a machine to render a webpage!
Minifying CSS has another use case: fair comparison of small stylesheets.
E.g. minifying the stylesheets from https://dohliam.github.io/dropin-minimal-css/ is a fairer comparison.
That way if a stylesheet looks "big", but has lots of comments, that is good, and shouldn't be considered "big".
OTOH if after minification one stylesheet is significantly larger than the other then you have to see whether it offers you any features you'd actually need to use.
And a small stylesheet will likely also have fewer rules. Even better if you can (automatically) drop CSS rules that your HTML doesn't use at all.
Sure that is not purely textual minification anymore, but it can help reduce and manage complexity.
If you're the kind of person that cares about the size of the (minified) stylesheet then it can help avoid making the stylesheets more complicated than necessary. And that can be good not just for performance, but also for future maintenance overhead.
I care about minifying the text of this site more than the CSS. By the time the viewport is 707px wide, the article text is double the normal font size (± some font-size-adjust, depending on your font), so I have to zoom out to 70% or further for comfortable reading.
As regards the content: the testing methodology is very bad yielding certainly wrong results; my feeling is that a fixed version would show much smaller benefits to minification. The synthetic stylesheet is wildly unrealistically simple, the minified version is completely broken (the semicolons are missing), latency effects are ignored even though they’re rather important in practice, the stylesheet is loaded via circuitous route rather than directly… there are enough really bad things that I’m not going to attempt to examine it in depth.
soulcutter | 9 hours ago
You’re not allowed to make a performance argument like that unless you’re on some type of extremely limited embedded hardware or something. Especially when you are serving MBs of JavaScript. Gzip is good enough for over the wire size, and if parsing whitespace has got to be so close to free that it’s not going to be a problem. I say this from the top of my head, and it seems like the article back that up with data.
lpil | 8 hours ago
I don't have a stance on minifying CSS specifically, but extremely limited hardware is much more common than one might imagine. Billions of people exclusively access the internet through very under-powered and often old mobile phones with very limited bandwidth and monthly data quotas. I want my websites to work for them just as well as they do for people in wealthy countries.
mayli | 7 hours ago
Then maybe try to reduce the usage of CSS, avoid heavy libs and gzip.
ggpsv | 3 hours ago
Like many things, it depends on context. Using more CSS might be preferable when dealing with limited hardware if it means less cost elsewhere.
I once worked in front-end performance for a big ecommerce site and a common task that I dealt with was refactoring naive React implementations of interactive components (e.g dropdowns, accordions, etc) so that they relied more on CSS than JavaScript. In most cases the additional CSS was superior to the removed JavaScript, not in terms of weight but in runtime performance as measured by the profiler and less jank in low-tier mobile devices.
hjvt | 6 hours ago
But also, no amount of asset minification is going to make the gargantuan SPAs that took over the web run well on an underpowered device, so it is a wash either way, IMHO.
zmitchell | 6 hours ago
Another class of devices are things like e-ink devices. You can be in the Western world and still be using an absolute toaster of a machine to render a webpage!
orib | an hour ago
Do you serve your websites without Javascript? For most devices, CSS is negligible compared to nearly everything else websites do.
edwintorok | 6 hours ago
Minifying CSS has another use case: fair comparison of small stylesheets. E.g. minifying the stylesheets from https://dohliam.github.io/dropin-minimal-css/ is a fairer comparison. That way if a stylesheet looks "big", but has lots of comments, that is good, and shouldn't be considered "big". OTOH if after minification one stylesheet is significantly larger than the other then you have to see whether it offers you any features you'd actually need to use.
And a small stylesheet will likely also have fewer rules. Even better if you can (automatically) drop CSS rules that your HTML doesn't use at all.
Sure that is not purely textual minification anymore, but it can help reduce and manage complexity. If you're the kind of person that cares about the size of the (minified) stylesheet then it can help avoid making the stylesheets more complicated than necessary. And that can be good not just for performance, but also for future maintenance overhead.
chrismorgan | 20 minutes ago
I care about minifying the text of this site more than the CSS. By the time the viewport is 707px wide, the article text is double the normal font size (± some font-size-adjust, depending on your font), so I have to zoom out to 70% or further for comfortable reading.
As regards the content: the testing methodology is very bad yielding certainly wrong results; my feeling is that a fixed version would show much smaller benefits to minification. The synthetic stylesheet is wildly unrealistically simple, the minified version is completely broken (the semicolons are missing), latency effects are ignored even though they’re rather important in practice, the stylesheet is loaded via circuitous route rather than directly… there are enough really bad things that I’m not going to attempt to examine it in depth.