4 ms·
The separation of concerns argument is dogmatic here. Just because it used to be that you should keep presentation in your CSS and behavior in your javascript,
by adrusi 11y ago
The separation of concerns argument is dogmatic here. Just because it used to be that you should keep presentation in your CSS and behavior in your javascript, doesn't mean that's a universal truth. It's a good abstraction to separate presentation from behavior, but that doesn't mean one has to be done in one language and the other in a different one. Separating the concerns just by partitioning them within your codebase is just as good for organization.
There are two real reasons to use CSS for your styles. One is that your page should work without javascript, and doing your styles in javascript is a completely stupid reason to break support for no-javascript environments. The other is user choice. If a user doesn't like something about how your page is presented, they can fix it using userstyles. Maybe some text is too small for them to comfortably read but when they zoom in the layout breaks or other text gets too big. It's hostile to break this standard feature of the web just for whatever silly gains you get from doing your styles in javascript.
- lowboy 11y ago> One is that your page should work without javascript Universal rendering would send straight HTML with inline styles to the browser. And plenty of web applications need JS to function properly.
- adrusi 11y agoTrue. Doesn't address the userstylesheet problem though. Also, sending prerendered pages with inline styles causes a bandwidth problem. Your prerendered page is probably dynamic and uncacheable, but your stylesheet isnt. By using inline styles, you send tons of repetitive uncacheable styles over the network where you could have just used a stylesheet. If you need the power that a full general purpose programming language gives you for some of your stylesheet, go ahead and use inline styles where needed, that's why they exist. But there's no reason that you should then decide that all of your styles ought to be inline.
- matchu 11y agoIf they're really that repetitive, then gzip should eliminate almost all of the bloat. We also need to think about number of round-trips. If you're on an old phone on a 3G connection in India, the extra round-trip from requesting the HTML then requesting the CSS makes a difference. I'm super interested about the performance aspect, too, but I feel like we need numbers to really go into detail. There's way too many factors at play here for the correct answer to be obvious.
- yid 11y ago> We also need to think about number of round-trips. If you're on an old phone on a 3G connection in India, the extra round-trip from requesting the HTML then requesting the CSS makes a difference. If your stylesheets are properly versioned, they can be cached forever, which means exactly the same number of requests as inline styles with much less bandwidth use.
- matchu 11y agoNot on first load. The cache needs to be populated somehow. I agree that it's a special case, but it's one we shouldn't just ignore.
- adrusi 11y agoAnd the number of roundtrips can be helped by using Keep-Alive.
- afarrell 11y ago> If a user doesn't like something about how your page is presented, they can fix it using userstyles I'm actually curious what percentage of people could do so in under an hour.
- DanBC 11y agoOr on mobile.
- adrusi 11y agoNot a huge amount of people will make custom styles, but they can be shared on sites like userscripts.org, for people who wouldn't bother making them or don't know css to use. Knowledge of basic HTML and CSS is more widespread than you might think. If you're using inline styles, you're likely to end up with a lot of elements that don't have classes or ids to target for styling, so userstylers will have to use complex selectors using :nth-of-type and such, which is harder, more fragile, and not even always possible. And every line of the userstylesheet will need !important annotations, which makes composing multiple userstylesheet on the same page more likely to break.
- dredmorbius 11y agoAll of this. I resort to a set of brute force or reset stylesheets which pretty much explicitly override everything. If you're going to use inline styles then basically fuck you.
- threatofrain 11y agoI believe there are extensions for this, and places where users submit their own stylesheets and rules. A few experts can do the work of many.