Live data from Hacker News

The Overcomplexity of the Shadcn Radio Button

paulmakeswebsites.com

271–280 of 351 posts

Re: The Overcomplexity of the Shadcn Radio Button

#271

This radio selection is brilliant silly, especially because the end result is indecipherable from a vanilla css rqdio button. For some reason people keep going back to complex UI and interactivity frameworks though, does anyone have a good example of a large website built without all this bloat? Asking because I've seen hundreds of small sites built with elegance and simplicity, and few large ones. Is it just inevita…

As company size grows, managers want to settle on a "standardized" tech stack that doesn't get in the way when they want to hire and fire people at will.

Nobody was ever fired for choosing React (or IBM). But everyone can get fired when they're working on a React app.

Re: The Overcomplexity of the Shadcn Radio Button

#272
post #235

Earlier quoted context omitted.

And even select is fully customisable now if you're targeting modern browsers

really? how?

The article says browser support is limited, but good docs: https://developer.mozilla.org/en-US/docs/Learn_web_developme...

Re: The Overcomplexity of the Shadcn Radio Button

#273
post #148

Earlier quoted context omitted.

I don't think this is specifically a react problem. The problem is that people don't want to learn what modern CSS can do, or write it themselves (see Tailwind), and most new frameworks make it easy to just sidestep that with div soup. Some of us _like_ CSS, and try to use as much of it when possible, but I feel like we are few and far between. I use react to manage the state of my app, but that doesn't mean I have t…

I really don't understand Tailwind. I heard great things about it, and then I tried it and it seemed like setting style="" on all elements, but with extra steps. Did we go off semantic CSS and returned to setting properties on each element, or was I using it wrong?

Plain CSS is very useful if all you have is an HTML page. Giving all buttons a consistent look is nice and easy if you can just specify that with a nice CSS selector. That's also the only place you can do it without changing all tags.

If you're building a component-based UI, that need is less, because all your buttons are created in a specific Button component. That's also an easy place to attach styling. You don't even need a separate file anymore.

But that's a wash. It gets much more interesting if you have components that are used in different contexts. Unordered lists for example can be an unordered list in the running text, but also a navigation list in the footer, the menu, or as tabs. There's some semantic logic to having those things as lists, but they usually look completely different.

You'd use classes and descendent selectors to deal with those differences. The downside is that those leak very easily to instances that you don't want them in. Having normal lists inside tabs inside running text requires careful engineering of the selectors.

The larger and older your project grows, the harder it becomes to get that exactly right in a future-proof way. At some point changing something for one item somewhere, can completely mess up something on another part of your site.

Inline styling, or Tailwind-style utility classes, are useful in that situation. Every component gets to be responsible for the way it looks and no longer has to care what anything else does. HTML tags that are used in different contexts will have their context right there, next to the styling. All part of the component.

The few remaining things that you need for consistency between components (colors, sizes, fonts, etc.) can be handled with CSS variables.

Re: The Overcomplexity of the Shadcn Radio Button

#274
post #264

Developers remember, you can always push back on design requirements instead of bringing in more bloat. I was sitting next to one of the devs in a co-working space and he was trying to figure out some specific layout issue in react native. He spent 4 hours + installed a dependency to be able to do something completely tiny on a privacy policy screen. He asked me how I would do it, I told him to just ask if it can be…

I'm finding it's better to use "javascript-less" UI frameworks [Pico.CSS, Skeleton, Bulma, Tailwind/daisyUI]. You get most of the benefits using good use of CSS. Anyone used these JS-free solutions and have recommendations?

My current choice is DaisyUI. It’s pretty good and because it’s based on tailwind you get the rest of the ecosystem benefits. Super easy to extend and change. Class bloat is much more manageable than raw tailwind.

Re: The Overcomplexity of the Shadcn Radio Button

#275

This is only "overcomplex" from a naive point of view. Radio buttons, as with all UI controls, have tremendous inherent complexity, which comes to light once requirements ask for something beyond the blessed happy path of the default browser button. Pixel perfect styling, animations, focus behaviors, interactions with external state, componentized branding to fit in with companies' ecosystems, etc. The baseline parad…

Agree, this kind of complexity is there for a reason. I would rather have a complex component that handles all the cases within its usage in the codebase over having a bunch of little hacks/changes in the usage. It's far easier to maintain one complex component than many different usages of that component. And you don't have to use such a complex component library if you don't need it. For small codebases it often is…

But handling edge cases is a self-inflicted wound, because you have decided to re-implement something that already has an extremely well tested specification and implementation in the browser. This is almost always a mistake.

Re: The Overcomplexity of the Shadcn Radio Button

#276

Earlier quoted context omitted.

> Isn't html/css enough? No, obviously. If you are writing complex web applications with state, local processing of data and asynchronous interactions it's not enough. You need javascript. If your javascript is especially complex and you desire it to be declarative, you probably need a framework. Do you need, I don't know, Tomcat in Java? Probably yes for a complex application and no for a simple proof of concept. Do…

>If you are writing complex web applications with state, local processing of data and asynchronous interactions it's not enough. >Next objection usually is: do you need complex apps on the client? It's not even an objection, it's a question I ask and almost never hear a coherent answer to. The vast majority of web applications I use every day (online banking, github, forums, social media, admin interfaces of various…

> I don't care that when I click "delete", the item may not disappear from the screen immediately.

The disconnect here between tech people and non-tech people is that most users do care about stuff like this.

I run a popular website as a solo project so all the feedback/complaints are routed to me, and one thing I've learned is that users really don't want websites to "feel old". Sure, they want it to be fast, but they also want all the bells and whistles like loading indicators and animations.

If you show Hacker News to someone who's not a developer, especially if they're under 30-35, their reaction to the layout and functionality will be visceral disgust. I really can't stress enough how much modern users hate the traditional plain HTML look. If you're trying to convince users to use your site and it looks or functions anything like HN, they'll get angry and close the tab within seconds to look for an alternative. Even if you've made a SPA with plenty of bells and whistles, users will still get upset if anything feels "clunky", which is often user-speak for "this component needs animations and a transition state". They don't know or care that all the fancy stuff increases the complexity of the codebase.

Every software project hits a point where the super clean abstractions the developers came up with start to clash with the messy way it's used in the real world. This is the frontend version of that. We have no choice but to give users the UX they want.

Re: The Overcomplexity of the Shadcn Radio Button

#277
post #52

I don't touch frontend very often anymore, but you could see the writing on the wall for complexity when React took over and newer devs were working exclusively in that abstraction. Unlike other abstractions where things get tidied up and more simple, React is much more complex than the technology it's building on. Necessarily, to enable it's features, but none the less it is a consequence of this that when all someo…

FWIW I've been writing UIs using plain JavaScript and the DOM API for like 15 years and at a certain scale, I always ended up building an ad-hoc framework or being disgruntled when I had to reach for any of the pre-React UI frameworks whose APIs and approaches I didn't like. React changes this, nowadays I either start with pure DOM and then rewrite to React or just start with React. I see a lot of hate online for Rea…

Hard feelings here. I like react and have to work with it, still it is all insanely wrong.

The best approach I've found so far is egui , and I hope people are moving that direction. Draw whole frame, collect events, process, update internal state.

Re: The Overcomplexity of the Shadcn Radio Button

#278
post #273

Earlier quoted context omitted.

I really don't understand Tailwind. I heard great things about it, and then I tried it and it seemed like setting style="" on all elements, but with extra steps. Did we go off semantic CSS and returned to setting properties on each element, or was I using it wrong?

Plain CSS is very useful if all you have is an HTML page. Giving all buttons a consistent look is nice and easy if you can just specify that with a nice CSS selector. That's also the only place you can do it without changing all tags. If you're building a component-based UI, that need is less, because all your buttons are created in a specific Button component. That's also an easy place to attach styling. You don't e…

That's interesting context, thank you.

Re: The Overcomplexity of the Shadcn Radio Button

#279
post #130
post #86

Earlier quoted context omitted.

> when all someone knows is React or other frameworks, things get overengineered The next level annoyance is that everybody just assumes React to be the default for everything. Check the Shadcn website. The landing page doesn’t mention that this is a React-only UI library at all. Same with Radix. The marketing sounds like a general-purpose UI lib. You gotta dig around a bit to realize that this is React-only.

my brain for whatever reason won't accept react it's just instant ejection. i was there in the before times all the way up till jquery became uncool and i just tuned out of front end entirely once react and all the stuff driven by facebook became so ubiquitous, my soul just does not want to dabble in any of it. i think im mostly just appalled at what feels like over complexity that might've made sense over a decade a…

I get the feeling. From someone outside looking in (haven’t done web work since the heyday of Rails), React and the associated modern stack looks a whole lot like a Homermobile built on the frame and engine of a go-kart, all held together with duct tape and twine sourced from TEMU. The idea that this is the web’s “final form” is difficult to stomach.

Re: The Overcomplexity of the Shadcn Radio Button

#280
post #259

Earlier quoted context omitted.

Not everything needs to be a SPA. I genuinely believe that the web would've been a much better place today on most important metrics (performance, simplicity, accessibility etc.) if this SPA shift would've never happened. The opportunity cost seems massive to me.

Most software I've used could have been a few hundred lines of PHP. But then they'd be done in like a day, which is great if you're a business owner (and the reason Pieter Levels uses PHP, for example), but not so great if you need to get paid to keep churning the code indefinitely (i.e. most people's situation)... and ideally hire all your friends to help too ;)

There are indeed less user-centric metrics with surprising weight when it comes down to it. I've also noticed that "We read a FAANG blog post and got enchanted" is easily remembered as "Everything was bad and we had to change it all" ;).
Post reply on HN