CSS bloat is there also, perhaps not as big a deal. I think that complexity is the main enemy (both JS and CSS and React and npm …) or over on the WordPress plugin morass. I like that the OP is aiming for a simpler world, kind of like the HTMX and Pico CSS ideas that I currently prefer.

> perhaps not as big a deal

If I load CNN.com right now and scroll to the bottom, I receive 26.9 MB over the wire.

Of that, 52.2 kB are CSS.

5,547 kB are JS.

CSS bloat is not as big a deal.

52K of CSS should be an opportunity for optimization but you're right, we're so far gone on javascript we should really focus on the mountains before the molehills.

I'm curious how much of that JS is functional and how much is adware.

The adware is typically injected onto the page by 3rd parties so it's nothing the web devs can do anything about.

> how much of that JS is functional

Lots of sites become more functional with JS disabled.

I'm more curious how much of that js is intended to load more js that has been blocked (by the browser, adblocker, hosts file/DNS, etc).

CNN specifically isn't a site I visit much, but most news sites load a ton of third-party stuff (being on mobile makes it hard to check)

It is the web devs' responsibility to say no to bs. However, very few do, and some even welcome the bloat as a job guarantee.

This is not how the web works.

That's like asking any other software dev to "say no" to letting other programs run concurrent with their own. It's just not within scope and any attempts to have your program behave this way will be impossible to maintain.

If you're a business that wants to inject ads without anyone getting in the way, all you have to do is host the pages somewhere the dev can't touch. This would likely be a CDN or similar for a multitude of other good reasons. So the content security policy is now only configurable by the admin who really doesn't give a shit and doesn't even know what's being hosted on there.

Use lite.cnn.com instead.

Tailwind v4 tree shakes too so even thats not technically bloated anymore

Tree shaking and bloat are different concerns. And, technically, is tailwind tree shaking? I thought they only built styles that the compiler could find being used rather than removing styles the compiler couldn't find being used.

Tailwind v4 tree shakes automatically on imports is what I understand.

I don't think it's identical to package tree shaking but the outcome is the same.

I don't think it was doing it before v4, or if it was, not as efficiently

Tree shaking is actually a sign of bloat. It is a tool on top of a bloated mess, to fix that mess. It would be better not to make a mess in the first place.

Type/JavaScript are extremely tree shakable if using esm.. what makes you think it's not?

Only at the most crude level. Ever heard of "virtual functions"?

Runtime polymorphism is great but I wouldn't consider that to be tree shaking.

But even a small bit of css can slow down page rendering. https://www.granola.ai/blog/dont-animate-height

That article refers to literally one line of css. Cutting down the volume of css does not have value, cutting down on animations and other expensive directives does.

If a small amount of CSS can, then so can a similarly small amount of JS, since JS can set styles.

I think that’s moot. Everyone agrees there’s a pretty big bloat problem in JS, not so much because of single costly lines (though, they exist) and more the entire ecosystem of includes

Why not? Code is liability. Less code to maintain also enhance engineer's ability to reason the code and implement better website.

Code is a liability lends well to tech debt, wasting time refactoring css to reduce the size by tens of kilobytes has no real world return on investment in most cases.