[!note] This blog-post is WIP/unfinished.
I’m not here to tell you “JS bad”, because many people have already done that:
I’m writing this for other reasons:
noscript users have to deal with, and how this effects “normies” as wellKeep in mind, I ain’t a luddite. And I don’t hate JS in particular. I love when JS is used right! such as:
Notice how the “competitive” one abuses ES/JS behavior to optimize the size of the program. That’s called code-golfing, and it’s totally acceptable to break best-practices to reach your goal, simply because the result pushes the boundaries of what was believed to be possible, and that’s cool, not disgusting.
noscript treated like 2nd-class citizennoscript usersif you wish your site to give its users a taste of how the WWWorst app store feels to us, add to web pages you control the following JavaScriptlet:
document.body.textContent = 'Please disable JavaScript to view this site.'
These exception-filters prove that enshittification effects everyone. I had to rewrite one of my filters because I never allow JS on windowscentral, so I never need to prevent uBO from being detected. The uBO team is forced to design filters for the lowest-common-denominator, leading to sad stuff like that.
If you visit any Discourse forum, you’ll notice they have graceful degradation (not PE). However, if you visit it using a phone, you’ll be greeted by this ✨ wonderful ✨ message:
“HTML content omitted because you are logged in or using a modern mobile device”
for _ in 0..=u16::MAX {
println!("WHY?");
}
I’ll ~steal~ borrow a quote:
Honestly, I am at a loss of words as to how to describe this without being extremely rude.
We need to talk about dark and light modes. Yes, this is so bad that it needs its own section.
Let me preface by asserting that your page only needs 1 line of HTML to support both preferences:
<meta name=color-scheme content="light dark">
That’s it! Just add that inside the <head> and your pages now can automatically (“dynamic” if you will) switch between both themes in real-time, adapting to user preference!
This is not new, it has existed for many years. No need to worry about “compatibility”!
I can already hear you complaining:
But the default browser stylesheet is ugly!
or:
But I NEED my pages to look the same in all browsers!
or:
But I have a Brand™! I have my own stylesheets to theme my site!
Fine, here you go:
/* default light */
html {
background: #ccc;
color: #111;
/* etc... */
}
/* conditional override */
@media (prefers-color-scheme: dark) {
html {
background: #111;
color: #ccc;
}
/* etc... */
}
No excuses!
But I NEED it to be configurable!
…why would you want that? It already is?
No! We want an obvious UI that allows users to choose a theme that doesn’t match the browser!
Again, why would you want that? Are your users complaining about “lack of choice”?
No…?
Then shut up.
But-
OK FINE!!! If you insist, just use a <form> element to take input and send it to the server, then the server response should set a cookie on the client, to remember the preference. Are you happy now?
but-
Now that the preface is done, let me tell you how much I despise youtube!
YT theme requires JS to detect preference:
This is bad, but it’s “forgivable” since YT needs JS for many things. However, it’s worth noting that YT remembers the last preference. I know because the server returns a page colored like my last visit. This is better than other sites, which fallback to a hard-coded stylesheet ([cough] disbloat [cough])
YT theme needs a full-page reload to apply…
wait, WHAT?!
![]()
what 👏 is 👏 the 👏 point 👏 of 👏 a 👏 “dynamic” 👏 language? 👏
seriously, WHAT IS THE DAMN FUCKING POINT OF JS IF YOU NEED TO RELOAD ANYWAYS‽‽‽
WHAT HAPPENED TO “single-page application™”‽‽‽
AND THEY HAVEN’T FIXED THIS FOR YEARS!!!
And you know what’s worse? That “Device theme” option (the one that “adapts” to your preference) requires you to manually reload the damn page just so that YT notices the change.
Have they heard of matchMedia?:
const light_query = matchMedia("(prefers-color-scheme: light)");
// sync
let is_light = light_query.matches;
// async
light_query.addEventListener("change", (e) => {
is_light = e.matches;
});
What kind of incompetence YT has??? No sane human should think that is “acceptable”!
But nooo, they’re too busy fighting ad-blockers, so they end up being “resource constrained” to actually improve UX
Let’s take a moment of silence to pray for our beloved YT…
After a word from our sponsor! RAID SHA- 🔫💥
I respect WP, I even like it, but I’m sorry, nobody can convince me that WP is “struggling” to implement auto-color-scheme for more than 6 years, that’s plain bullshit.
The CRW is powered by MediaWiki as well, and its theme is fully adaptive without JS. So why does WP still consider “Auto” an “experimental feature”? and why does it require JS?
WP has much more money and contributors/volunteers than CRW, and they still fail to provide such a simple feature?
I’m sorry, again, if anyone gets offended, but this implies that WP doesn’t care about its users. And if they do care, they’re lazy and incompetent. There is no other explanation.
Roasting others is unfair, so here I’ll roast myself, for the sake of “redemption”.
If you’ve visited my GH-Pages site, you’ll quickly notice that I’m a hypocrite! All of my pages (except for RGB-DR) are either light or dark, even with JS enabled.
I’d like to blame Jekyll themes for this, but this is my mistake, and I have to deal with it.
Don’t worry, I’m working on fixing it!
I don’t want you, dear reader, to feel like a doomer/gloomer after reading this. So here are some good news to give you hope!
noscript). Previously, it was just a generic page telling you to enable JS. I wish I could say they care about noscript users, but they don’t care about their users in general. I guess they’re experimenting with SSR or pre-renderingnoscript