Live data from Hacker News

CSS is powerful, you can do a lot of things without JS

github.com

271–280 of 319 posts

Re: CSS is powerful, you can do a lot of things without JS

#271
post #122

I've worked with people who did things like this. It's not fun for anyone else on the team to try and figure out why you're using specific pseudo selectors on tags in a child inside a sibling in some label to make an accordion that would take 3 lines in Javascript.

Your complaint is essentially that they are using a language that other people working on the same project don't know. There are good reasons to discourage that: it fosters bikeshedding, and CSS's ways of expressing dynamic behavior doesn't match intuition as well as procedural javascript. However these reasons have to be weighed against technical limitations. Using CSS for dynamic behavior is often better than using javascript because many more people disable javascript than CSS. If the project requires javascript for some other important part of the page, then it's not worth the complexity of specifying dynamic behavior in CSS. But if all parts of the page work well without javascript, then introducing a dependency on javascript for something like an accordion is probably not rational if you have someone who knows how to achieve the same effect with CSS.

Re: CSS is powerful, you can do a lot of things without JS

#272

Most of these are just clever CSS hacks. There is a website collecting these kind of experiments since the early '00: http://www.cssplay.co.uk/ There was a time when separation of concerns and the "Rule of Least Power"[0] where the foundation principles of web development. Today you have preprocessors, postprocessors, transpilers, content and style in JavaScript, behavior in CSS. Very powerful tools that can easily l…

The semantic web failed in large part because browsers didn't implement XSL, and so the average web developer never learned about the idea of sending structured data to the client as XML and using XSLT to instruct browsers to render the data as XHTML. If these specs hadn't been released in the middle of Internet-Explorer-monopoly-induced-browser-stagnation then they wouldn't have been dismissed as failures by the time browser competition increased and standards started to be honored.

I'm not sure that the semantic web would succeed even if it were a new idea today. HTML5 was popular because it gave web developers tons of shiny toys and got them excited to use it. XHTML was conceptually beautiful but it hardly enabled any user-visible improvements over HTML4, so only the philosophically-minded web developers gave a fuck.

Re: CSS is powerful, you can do a lot of things without JS

#274

Earlier quoted context omitted.

> I don't know of anyone who is asking for more interactiveness for most of the web Hi, that's me. The reason is, quite simply, because this is not a good user experience: https://pbs.twimg.com/media/CmaP3JvUcAA8-5a.jpg:large The open web is my platform of choice, and the technology is finally there. Progressive Web Apps[1] offer the features of native but are instantly-available, without downloading or installing. S…

I don't see how that image proves your point. Shitty designs are shitty if they are in a web-app, or mobile-app. OK, fine. I'll concede devs want more interactiveness. I have yet to see evidence that users want more interactiveness. I think that points to the arrogance of devs "who totally know better than the user".

Users want positive experiences, and devs want to build those positive experiences. Look at some of the most popular websites out there: Youtube, Spotify, Amazon, Reddit - they're built on interaction. You're not just reading a post on reddit, you're upvoting it and influencing the front page.

This had traditionally happened through POST/GET requests and having all the logic server-side. Yes it's possible to build interaction without Javascript, but it's not a great effect. Imagine if you had to wait for a page load every time you voted on a post on reddit.

Now extend that to modern webapps. Take Google's Voice Memos demo[1]. It loads instantly. It supports any device. You can even add it to your homescreen and you won't be able to tell it from a native app. Everything about it just works. Why would a user not want such an experience?

Javascript interaction is the natural evolution of the web. If it wasn't JS it would have been something else. This growth has been driven by users, devs, and browser vendors alike. There's nothing "arrogant" about it.

[1] https://voice-memos.appspot.com/

Re: CSS is powerful, you can do a lot of things without JS

#275
post #271
post #122

I've worked with people who did things like this. It's not fun for anyone else on the team to try and figure out why you're using specific pseudo selectors on tags in a child inside a sibling in some label to make an accordion that would take 3 lines in Javascript.

Your complaint is essentially that they are using a language that other people working on the same project don't know. There are good reasons to discourage that: it fosters bikeshedding, and CSS's ways of expressing dynamic behavior doesn't match intuition as well as procedural javascript. However these reasons have to be weighed against technical limitations. Using CSS for dynamic behavior is often better than using…

Lets be honest, 99% of people who disable javascript are programmers who take great honor in complaining about every website that is more than 200k in size. This is a non-issue for most companies.

Re: CSS is powerful, you can do a lot of things without JS

#276
post #231

Earlier quoted context omitted.

The point is: Usually, you must know the rules to break them. In this particular context, looks like the original rules are fading away. No rules = Anarchy.

Nitpick, but anarchism is not the lack of rules, it's the lack of rulers.

That's not really a nitpick: in case of the Internet, it's the main modus operandi - with various warlords carving out a temporary fiefdom here and there (remember the Browser Wars, when IE had 90%? Brace yourselves, we're headed for a re-run with Chrome), but no actual rulers or enforcement.

Re: CSS is powerful, you can do a lot of things without JS

#277

Earlier quoted context omitted.

This is a-historical by my memory - the entire reason Gmail became so successful was that its use of "fancy ajax interactions" made it shockingly nicer to use than any of its competitors at the time. I think if one of your main selling points is interactivity afforded by javascript, then it is unlikely to have much return on investment to accommodate users who don't want that. But for sure people should be thinking h…

AJAX isn't why Gmail became successful. What set Gmail apart from its competitors was the huge amount of initial storage you got (1 GB for free at a time when Hotmail offered less than 10 MB for free), a higher maximum attachment size (25 MB compared to the webmail standard 10 MB), Google search, and conversation view. All of which, by the way, worked with the AJAX-free basic HTML view.

Also the spam filtering was years ahead of it's time

Re: CSS is powerful, you can do a lot of things without JS

#278

Earlier quoted context omitted.

Agreed, however there are a ton of companies with extremely outdated os/browser policies, that refuse to update for whatever reason. Been a contract developer for ~10 years and even this year we were told to support IE 8 on a specific project because some fortune 50 company needs us to (Seriously). There were plenty of modern tools that helped reduce issues but there was still a bit of headache.

That headache is what you get paid for.

Nope. There's usually plenty of work to do; supporting IE4 (or FF 3, or whatever Webkit shipped on Android 1.6) just makes it longer and over the budget, while squeezing out other projects.

In a word: busywork.

Re: CSS is powerful, you can do a lot of things without JS

#279
post #255

Earlier quoted context omitted.

I'm interested in seeing these 3 lines of Javascript that can implement an accordion. With a sane limit to number of characters on each line as well.

Here you go: http://jsbin.com/codedujeqe/edit?js,output JS: var panels = [...document.querySelectorAll(".accordion li")]; panels.forEach(x => x.addEventListener('click', e => panels.forEach(y => y.setAttribute('class', y == e.target && !y.classList.contains('open') ? 'open' : '')) ));

Thank you, exactly what I was hoping to see instead of the usual arguments that don't actually fulfill the request.

Re: CSS is powerful, you can do a lot of things without JS

#280

Earlier quoted context omitted.

I'm interested in seeing these 3 lines of Javascript that can implement an accordion. With a sane limit to number of characters on each line as well.

https://jsfiddle.net/e77f4hhz/

Ah, someone else answered the call instead of trying to insult my intelligence. Thank you.
Post reply on HN