Live data from Hacker News

Shoelace: A library of web components

shoelace.style

71–80 of 114 posts

Re: Shoelace: A library of web components

#71
post #12

Earlier quoted context omitted.

The only reason we have 10,000 UI libraries in the last 20 years is because we decided to keep default browser UI ugly and bare-bones for some reason.

That's a good thing in my opinion. Don't give me a set of 25 controls, instead make it easy to make my own. Because no matter what you include in default controls, I am going to need 12 more.

But the default set has been lacking for too long now too. Webbrowsers should really get together and make a new default set of Application-based UI controls, and make them a bit more beautiful by default. :)

Like datatables, rich-text editing, toolbars,...

MOST applications are just simpler CRUD UIs. Developing these is still too complex on the web platform.

Re: Shoelace: A library of web components

#72
post #38

These all look the same. Are there any designers out there who do not follow the "current thing" and can actually think for themselves? I want an opinionated component system which do not look like the others.

Serious question: if you're building an application, why do you want this? It used to be a huge thing to build Apple, Windows, Motif, whatever apps closely in accordance with their interface guidelines and idioms, but for some reason on the web everyone seems to need an idiosyncratic, opinionated set of basic controls.

Oh for sure if there was a web platform look, I would happily oblige and use that look. The point is that there isn't one so in that case I would rather have something different.

If we had gone down the path of smart documents instead of web apps for the internet, we would have had a better time for sure.

Re: Shoelace: A library of web components

#73
post #12

Earlier quoted context omitted.

The only reason we have 10,000 UI libraries in the last 20 years is because we decided to keep default browser UI ugly and bare-bones for some reason.

That's a good thing in my opinion. Don't give me a set of 25 controls, instead make it easy to make my own. Because no matter what you include in default controls, I am going to need 12 more.

> instead make it easy to make my own.

But browsers don't do that either. And you really, really don't want to make your own controls most of the time. Because: https://drewdevault.com/2021/06/27/You-cant-capture-the-nuan...

Re: Shoelace: A library of web components

#75
I'm impressed with the breadth of Shoelace's offerings, particularly its emphasis on accessibility and framework compatibility. For a project I'm working on, which involves creating an interactive e-learning platform, components like adaptable quizzes and responsive drag-and-drop interfaces are crucial. Could Shoelace be extended to include such interactive elements, maintaining its accessibility standards?

Re: Shoelace: A library of web components

#76
post #51

We at Microsft used this to build apps.microsoft.com. We're quite happy with the results. Shoelace is customizable, accessible, extensible, easy to use.

This is nice and all, but when I see what the big companies do, I always have this cave-at in my head - "is this one of the teams with enough resources to boil the ocean?" I.e. it's proof that Shoelace, in this case, is not inherently useless. But it's hard to get a hunch for how good it is to a mere non-corporate. Gotta give props though, the apps site is fast and slick.

That's a fair point. Big companies do have the resources to go all out, but that doesn't always mean their solutions are the best fit for everyone. I think Shoelace is pretty neat because it's more approachable for folks who aren't part of those mega-teams.

Re: Shoelace: A library of web components

#77
post #16

I'm not happy with any of the solutions to prevent a flash of undefined components. Has anyone given up on web components for that reason? Or is there a best practice for this?

I usually hide the web components until they are defined using `:not(:defined)` CSS selector

That causes CLS which is also an issue

Re: Shoelace: A library of web components

#78
post #41

Earlier quoted context omitted.

Sounds like you might like the idea coined as "HTML Web Components": https://blog.jim-nielsen.com/2023/html-web-components/ You basically write all the normal HTML and CSS so it's loaded in right away. But then you also make use of the advantages that defining a custom element gives you.

Yes, this technique sounds really good. Thanks for this.

You're welcome!

I've started moving to this technique from my earlier technique of putting a data-module on wrapping div components, where I manually had to deal with a bunch of stuff which HTML Web Components just do for you for free. Super handy!

Re: Shoelace: A library of web components

#80
Haven't done frontend in a long time, but how is this different than something like Bootstrap? Is it the fact that it comes also as a React & co library and you can customize properties of a 'component' easier than building your own wrapper 'component' to modify properties which are set via 'data' or 'css' attributes? I guess this leads me to the next question, I saw in a recent project on my company's Github how everything was done with 'React-Bootstap', which to me looked very weird, that in every Jsx component there was barely any HTML tags, but only smaller components from this bootstap-react library, even for simple things like s. It all looked like a mess to me, but maybe my views are from older times.
Post reply on HN