But if you’re already using npm in your project, as a significant number of front end projects are, it means you can serve them directly rather than requiring an external CDN.
Storing your food in the fridge requires an entire fridge (and power, and...)
Your particular circumstances might not require it (maybe you're just temporarily camping or you only store non-perishable food) but that doesn't mean that fridges, in general, are unnecessary or less convenient than just storing food in a cupboard. Even if you only eat in restaurants and you don't need a fridge, the restaurant does.
This being packaged won't prevent it from being delivered from a CDN. It will actually make it easier to automatically deploy all versions to CDNs as they are published, like in https://www.jsdelivr.com/, while being CDN-only is less convenient when you actually need the many affordances that a package manager provides.
If I already have a package manager and do:
yarn add css-extras
And then in my code:
import 'css-extras';
...and I get it versioned in my package.json, cached, available offline, not subject to link rot, automatically inserted in my bundle, processed, minified and with its dead code eliminated... that's surely more convenient than vendoring from a CDN and manually doing all that process (or worse, not doing it at all and just dropping a raw <link> to the CDN in my HTML, with all its drawbacks).
Welp, time to make a @function preprocessor. There is no reason for every single client to recalculate things which could have been completely or partially calculated at build time.
But there are also plenty of use cases where recalculation will be valuable in the client. CSS variables cascade so a preprocessor isn't going to be able to know ahead of time what any given variable value is.
It's a tradeoff. I expect this to be non-trivial, do nothing in the general case (when referring to runtime CSS vars) and possibly increase your final CSS size for any sufficiently complex codebase when unrolled.
It would be quite nice to see some more "killer" uses of this new feature that aren't just "we removed some duplication and... saved less than 1% of our loc".
And maybe there are some really compelling ones... I think the only really useful one I see here is `--abs`, which really should just be built-in.
Whoo. I’ll be the first hyper negative prototypical HN commenter.
I’m glad I don’t work on browser engines for a living. CSS is getting more complex and spaghetti-capable by the day.
> Currently only supported in Chrome 141+. The @function rule is going through the W3C standardization process and will be available in other browsers soon.
Also, pretty tired of Chrome effectively front-running standards as a not-so-subtle means of cramming them through.
One person's front-running is another's reference implementation.
Although, yes, CSS is getting more complex because everything on the web is. What's the last standard feature to really be taken away after actually existing in the wild for a while? XHTML and Flash (effectively a standard if not in reality)?
So I guess it really is true that nothing actually gets removed -- except the one that wasn't actually controlled by WhatWG or W3C.
Is there still a real-world use case for XHTML/"XML syntax for HTML", or is this just exhibit A that no standard can actually be removed from browsers?
Re: XSLT, back in the everything-is-XML days I desperately wanted to like XSLT, it seemed so useful (I was that annoying co-worker telling everyone it's supposed to be pronounced "exalt"). But it was such a disaster to actually write or read and no real debugging was possible, I had to use a LOT of conditional bgcolor=red to figure anything out. It didn't take very long to come to the conclusion that XPath was the only useful part.
Web standards are in the same boat as C++. They can never really deprecate anything, but they want shiny new things, so they just add and add on top of the pile.
Every feature sounds great in isolation, but in aggregate they become a moloch.
Then people say “modern CSS is great, you just have to pick the ‘good subset’.”, but then nobody can agree what that subset should be, and everybody else uses a different subset.
LLMs also contribute to this, as 90% of what’s available on the web is considered outdated now, but that is the majority of training data.
Oooh this will not end well.. Also side question, is it really necessary to have this as an npm package ?
> is it really necessary to have this as an npm package ?
Is anything really necessary? Not snark: almost nothing is necessary in life but many things are convenient.
Surely a cdn is more convenient. I don't want to install an entire package manager just to 'install' 2 CSS files.
A convenient thing about npm is that you automatically get a CDN too.
https://cdn.jsdelivr.net/npm/css-extras@0.3.1/index.css
But if you’re already using npm in your project, as a significant number of front end projects are, it means you can serve them directly rather than requiring an external CDN.
Storing your food in the fridge requires an entire fridge (and power, and...)
Your particular circumstances might not require it (maybe you're just temporarily camping or you only store non-perishable food) but that doesn't mean that fridges, in general, are unnecessary or less convenient than just storing food in a cupboard. Even if you only eat in restaurants and you don't need a fridge, the restaurant does.
This being packaged won't prevent it from being delivered from a CDN. It will actually make it easier to automatically deploy all versions to CDNs as they are published, like in https://www.jsdelivr.com/, while being CDN-only is less convenient when you actually need the many affordances that a package manager provides.
If I already have a package manager and do:
And then in my code: ...and I get it versioned in my package.json, cached, available offline, not subject to link rot, automatically inserted in my bundle, processed, minified and with its dead code eliminated... that's surely more convenient than vendoring from a CDN and manually doing all that process (or worse, not doing it at all and just dropping a raw <link> to the CDN in my HTML, with all its drawbacks).> Oooh this will not end well..
On the contrary. CSS functions and mixins may make a lot of current cruft unnecessary.
Welp, time to make a @function preprocessor. There is no reason for every single client to recalculate things which could have been completely or partially calculated at build time.
But there are also plenty of use cases where recalculation will be valuable in the client. CSS variables cascade so a preprocessor isn't going to be able to know ahead of time what any given variable value is.
It's a tradeoff. I expect this to be non-trivial, do nothing in the general case (when referring to runtime CSS vars) and possibly increase your final CSS size for any sufficiently complex codebase when unrolled.
CSS is becoming a programming language and not just a style sheet. Don't worry about performance, soon you'll be able to run assembly in it.
Yet recently I couldn't find a way to count cousin elements using has and nth-of-type. JS still is needed when use case gets a little complex.
Did you try counter()? There's also the upcoming sibling-index()
Obvious question: are CSS functions Turing complete?
I remember there's expression() on IE6.
I’m so confused why people are ragging on this. Why is this considered detrimental? Looks pretty good to me…
It would be quite nice to see some more "killer" uses of this new feature that aren't just "we removed some duplication and... saved less than 1% of our loc".
And maybe there are some really compelling ones... I think the only really useful one I see here is `--abs`, which really should just be built-in.
Whoo. I’ll be the first hyper negative prototypical HN commenter.
I’m glad I don’t work on browser engines for a living. CSS is getting more complex and spaghetti-capable by the day.
> Currently only supported in Chrome 141+. The @function rule is going through the W3C standardization process and will be available in other browsers soon.
Also, pretty tired of Chrome effectively front-running standards as a not-so-subtle means of cramming them through.
The standard for this has been developed in the open at the CSSWG with one of the SASS developers:
https://github.com/w3c/csswg-drafts/issues/9350
One person's front-running is another's reference implementation.
Although, yes, CSS is getting more complex because everything on the web is. What's the last standard feature to really be taken away after actually existing in the wild for a while? XHTML and Flash (effectively a standard if not in reality)?
XHTML (or the XML syntax for HTML) wasn't removed (see: https://html.spec.whatwg.org/multipage/introduction.html#htm...). You may be thinking of XSLT, which may be removed in future.
So I guess it really is true that nothing actually gets removed -- except the one that wasn't actually controlled by WhatWG or W3C.
Is there still a real-world use case for XHTML/"XML syntax for HTML", or is this just exhibit A that no standard can actually be removed from browsers?
Re: XSLT, back in the everything-is-XML days I desperately wanted to like XSLT, it seemed so useful (I was that annoying co-worker telling everyone it's supposed to be pronounced "exalt"). But it was such a disaster to actually write or read and no real debugging was possible, I had to use a LOT of conditional bgcolor=red to figure anything out. It didn't take very long to come to the conclusion that XPath was the only useful part.
> So I guess it really is true that nothing actually gets removed -- except the one that wasn't actually controlled by WhatWG or W3C.
XSLT is a W3C standard:
https://www.w3.org/TR/xslt/
Web standards are in the same boat as C++. They can never really deprecate anything, but they want shiny new things, so they just add and add on top of the pile.
Every feature sounds great in isolation, but in aggregate they become a moloch.
Then people say “modern CSS is great, you just have to pick the ‘good subset’.”, but then nobody can agree what that subset should be, and everybody else uses a different subset.
LLMs also contribute to this, as 90% of what’s available on the web is considered outdated now, but that is the majority of training data.