Web development is hard. There's inherent complexity in building quality sites that solve problems and work well across a wide range of devices and browsers.
But some things don't have to be hard. Browsers make things like radio buttons easy. Let's not overcomplicate it.
A great read by Paul Hebert that questions the tradeoffs of big, batteries-included accessible UI frameworks like Radix and React Aria Components. Isn't this supposed to be the browser's job? Why reinvent?
Well, yes. But also browsers are notoriously inconsistent across devices. And maybe that's important to you. As Paul said in his very kind response:
A great list of questions from someone with an architect's mindset.
I think shadcn/ui was a great innovation — instead of making difficult-to-override component libraries, lets just copy them into our codebases so we can directly control the styling and appearance of the components. It's so easy to add new components, and they're guaranteed to work well and look good. Brilliant!
And I think it rightly throws Radix UI in there to ensure that, by default, components are as accessible as possible by default. It's a good impulse. But it is also one with tradeoffs. As Paul says, it adds a lot of complexity that might not be necessary.
The problem with such an easy to use solution like shadcn/ui is that you're instantly saddled with all of the decisions that came along with it. Unless you are manually going through and adjusting every little thing, there's no intentionality. You just add the components and move on with your life.
Paul rightly argues that there's a better, simpler way. Just use the browser. Its accessibility is good enough. Its interactions are consistent enough. Users will not know the difference.
And this isn't just about user experience; it's about developer experience too. In fact, that's all he's complaining about. The user experience of loading and parsing JS basically gets a footnote at the bottom.
It's compelling. Recently I've seen myself wanting to move away from React (Remix v3 is compelling), Tailwind (modern CSS is so good), and bundlers altogether (especially for small projects). Doesn't that just sound simpler?
Except... I really do think that Tailwind makes it easier for me to style my sites. Would writing CSS by hand add mere marginal gains, or would it unlock some powerful performance improvements? Or at very least remove the need for a build step?
This is why decision documents are so important. By documenting the intentional decisions that were made, we can trace the thought process and requirements that went into them. Decision documents are evidence of intentional decision making.
There's a lot that can be done to make sites better. It just depends on your definition of "better" — what tradeoffs are you willing to make?