How many kilobytes of resources (CSS, JS) do you deem acceptable? I need to know how much I should optimize.

And no, I will not use no JS. Don't suggest that. Svelte is needed.

If you need more than 32k of minified, but not gzipped CSS, there's likely something wrong - most probably littering the HTML with presentational classes, which also blows up the HTML.

Just lookup the max amount of cach for each supported browser and pick the smallest number. Another way is testing your load times under the desired min bandwidth and get it down to modern human attention spans (around 3 to 5 seconds). Nobody cares about the actual number anyway.

svelte xddddddddd

@tekashi What's wrong with it?

My whole website is 188k. That's minified but not gzipped and it includes images.

@olback 188k? By far not, it's about 420k.

@Fast-Nop I guess you included fonts?

@olback Yeah, but even when subtracting them, it's still 260k. But in devtools, I see that both the JPEG and the WebP are being downloaded, and given that my browser supports WebP, I guess the JPEG isn't intented to be loaded. That would cut out another 100k indeed.

@Fast-Nop Right, that's probably the Favicon. I'll have to look into that. Still, rather small compared to any other site built with Angular/Vue/Whatever.

@Fast-Nop More than 32K is bad? Dang, I thought we where doing good with 83K CSS (minified+gzip and using webpack for a single file).

But you're probably right, this shit is mostly bootstrap CSS, and like 95% isn't needed most likely.

But it's not like the front end devs here care... I actually had to adjust the file size limit for images in our CMS because these fucks kept uploading up to 25MB images to display on our website. I put the limit at 50KB (which is a lot since it's mostly tiny pictures), for anything bigger they need to ask me.

NO KAREN YOUR 40x40px JPG THUMBNAIL SHOULD NOT BE 1378KB.

@slashasdf Bootstrap is always bad because like all CSS frameworks, it relies on presentational abuse of CSS. Can't be different with a generic CSS framework.

Also, it blows up the HTML for no reason. Which in turn slows down both rendering and JS execution because there's several thousand DOM elements where it should be a few hundred tops.

@Fast-Nop Wouldn't say bootstrap is ALWAYS bad, it really depends on the use case (it is really great for prototyping for example).

And, to be fair, bootstrap is hardly the main reason why many websites using it are slow.

A lot of websites load so much freaking analytics/marketing/heatmap crap without deferring or using some kind of intersection observer to load on demand.

For many of these websites bootstrap causes the least of their issues.

@slashasdf Well yeah for quick & dirty throw-away mock-ups, anything goes of course. But Bootstrap contributes just in the CSS domain, and what it contributes sucks.

What is more worrying than the actual damage Bootstrap does is when devs see no issue with Bootstrap's class abuse - and that points to a deep lack of understanding what CSS and HTML are even about. Which helps to explain why most websites are bloated train wrecks.

Okay, I'm down to 8.5KB CSS with PurgeCSS in the Webpack chain.
89KB JS because of Svelte, but that's fine.

@slashasdf Bootstrap isn't good for prototyping, drag and drop editors or Illustrator are. Prototypes should be way quicker than to write actual html, and way less flexible or efficient than to be released. Even hard coded data or client side mock dbs fly.