JS should just do the same in the browser instead of relying on an arcane language not designed for this

But, if I* have to write this same animation in two years and @property is widely available, I'll reach up for that first.

*To be honest, it will be 100% an LLM that writes it for me.

"Arcane language" not only is CSS one of the core languages of the web, but also if you find this arcane I wonder what you think of the "native" code that react native is generating for the animations.

CSS as an animation engine is completely acceptable, and it's limitations (like the one in TFA) are slowly being pushed back.

  >"Arcane language" 
  >"native" code that react native is generating for the animations.
  >CSS as an animation engine is completely acceptable, and it's limitation
  >TFA

I welcome opportunities to avoid javascript in my sites, even if it's more work for me. It makes life easy for visitors who prefer to disable javascript, thereby avoiding many of the exploits, trackers, etc. that plague the web today.

By the same token, I appreciate sites that do not require javascript.

See:

- CSS keylogger, 2018: https://github.com/maxchehab/CSS-Keylogging

- OWASP cites CSS injection as a mechanism for XSS and data exfiltration: https://owasp.org/www-project-web-security-testing-guide/sta...

Luckily we haven’t seen new classes of attacks here, but being concerned about attack surface of any browser technology is valid and reasonable.

They try to sandbox it.

There are more clever ways now. Like... everything you interact with is a binary search into a projection of your (2^n-interaction) "guess"-ed/history.

If you interact with it, then it is assumed that you can see it.

Even detecting if the room is generally lit or not via the Ambient Light API can be paired with bright and dark elements to ping flashes off your face, in a dark room, to read whether or not elements were of that certain color.

But lets scrap :Visited and use arcane browser implementations and user behaviors; even something as innocuous as zooming slightly in or out is a session-persistent signal. The browsers explicit and even _inferred_ zoom level can be leveraged. A few irrational numbers and difference in spec implementations and your zoom level on Compromised_Site_A can identify you exactly from Compromised_Site_B even without Javascript.

But let's reset zoom between domains. Easy? sure.

But something still has to get painted to the page, like images, that could be cached....depending on how long they have been visited, and from what domain, and from what order. And the timing between all those are almost certainly unique to few, and sensitive to all.

If you load a thumbnail from Bad_site_a within 100ms in a country that blocked the original resource....thats a paddlin.

Those are just the first few, I could go on.

  CSS is never going to be able to, on its own, read and exfiltrate the data necessary.

https://blog.sheddow.xyz/css-timing-attack/

  You're relying on things like access logs at that point.

https://portswigger.net/research/ublock-i-exfiltrate-exploit...

IMHO, I see all those bells & whistles more related to scripting than to styling. I'd prefer to be able to navigate with Javascript disabled and not having to suffer some superfluous animations, but maintain the styles.

Original idea puts it under the authors control to add @prefers-reduced-motion media queries.

Might be that some browsers do this anyway, otherwise it would be easy with a user script or user style sheet.

This article argues for the spirit of the spec:

https://css-tricks.com/nuking-motion-with-prefers-reduced-mo...

> “animation isn’t unnecessary.”

It has a point, intrusive animation's main bastions are not CSS-based anyway.

For example, there seems to be a continuous (JS- and HTML-based) cat-and-mouse game that makes me require an ad blocker to disable autoplay videos on news sites, regardless of browser preferences.

This part is like the DNT header all over again, incentives don't align.

And the lesson should be that CSS is the most benign battle site for this issue, because it is customizable and not yet locked down behind anti-debugging and obfuscation techniques.

Moving work from JS to the browser’s native, polished, tested implementation with optimized performance is the right thing to do.

Of course, not disagreeing with that. It is just done in a way that is complex and cumbersome IMO. CSS is often handled by people with very little programming experience as well. I have worked for companies which gave me HTML templates, and CSS files, and my job as the developer was basically do add dynamic behavior by fetching stuff from their DB and looping over some data here and there to fill out lists/tables with actual content. To me that was very pleasant; but the guy handing me the CSS and HTML templates, had zero programming experience.

I think webdesign already is a copy-n-paste bonanza, where people find something they like, and copy it; if it gets very complicated as well. Developers are often last resort in terms of finding out why something does not work, and I fear complicated CSS after a few rounds of copy-n-paste is going painful to unwrap.

kelnos> This seems like a bit much. More than a bit much.

I just said that web-design, either done by programmers with zero design experience, or by designers with zero programming experience lends itself towards copy-n-paste (from different resources online). I.e. many people copy-n-paste stuff they don't really know much about in order to make their website look decent. If the underlying technology is complex and difficult to understand, this can lead to an unholy mess that (most likely) developers will have to unwrap.

The reasoning: some hosting platforms allow you to personalize your personal page changing the HTML and CSS bits, but not the JS - for security reason, obviously. Itch.io is an exmaple of that, where you can personalize your game and profile. By using CSS animations I can create cool effects without any of the security concern that allowing access to JS gives me. It makes sense and it's nice to be able to do so.

I don't understand this sentiment. If you are not a web developer, and in particular not a frontend web developer, then you probably aren't building html elements with these fancy effects. And if so, then why does it matter what advanced things CSS is capable of?

> Can't this be done with Javascript?

You can totally do this with javascript. You can plop in a canvas, and use webgl to program this effect on the GPU, like a real graphics programmer. You would have to recreate all accessibility features of the html button on your own. Is it going to be easier? I doubt it. But you certainly can.

With web development, I've always thought that there is an element missing for many devs: design acumen and appreciation (I need better terms.) Just look at the site linked from this post and you see an attractive personal site. Most devs struggle with these aesthetic elements.

Desktop development is fairly constrained. As an example, devs can make good or bad decisions around use of the toolkit, but it's less of an open canvas than the web. A lot of the expanded scope of CSS can be more easily exploited if you appreciate the design aspects or have designers creating some target design for you. Putting these capabilities in front of devs without those elements doesn't lead to much success which is another factor driving sentiment.

My understanding of CSS animations is that they are particularly optimized to run more efficiently and it’s also helpful that it runs outside of the JS runtime, which frees it from any errors in the JS or it adding to the CPU load that may already be chugging along on the page.

Additionally (and this is old info so it may be outdated), using things like `translate3D()` instead of just `translate()` in your CSS will engage the GPU to handle whatever your instructions are, making everything smoother and further unburdening the CPU. This is from my own memory of things I read more than 10 years ago, so it’s possible that even more CSS functions use the GPU at this point, but I’ve not looked it up since.

Anyway, tl;dr: there are performance benefits to using CSS instead of JS for animations.

You and I are NOT designers if I may be so bold. In 1996 I was one of about 100 people on new and MAJOR website/application build. From scratch. My role: Billing Lead. As a "full stack dev" only my eCommerce insights were needed from me. It is called FOCUS.

As a StartupBus alumnus of three treks the model was brilliant: Build teams from three skill sets: Devs, Designers, and BizDevs. Focus.

I love that the examples will not be gibberish to the designers of our day.