Live data from Hacker News

Shoelace: A library of web components

shoelace.style

91–100 of 114 posts

Re: Shoelace: A library of web components

#91

Earlier quoted context omitted.

How do we write this? I googled some tutorial and it seems it is still JS under the hood

It's basically just web components without the ShadowDOM implementation. I do it in some projects, but it comes with other drawbacks too.

Yeah like no slots.

Re: Shoelace: A library of web components

#93
post #91

Earlier quoted context omitted.

It's basically just web components without the ShadowDOM implementation. I do it in some projects, but it comes with other drawbacks too.

Yeah like no slots.

Nested components are not playing nice with their lifecycles too.

Querying elements also becomes more complex.

Re: Shoelace: A library of web components

#94
post #2

On my phone, the whole page is covered by the left side menu. Tapping on the burger doesn’t hide the menu either. Not a good impression from a web design library.

Hilarious how the basics keep getting broken despite the huge amount of collective effort to reinvent the basics

Re: Shoelace: A library of web components

#95
post #94
post #2

On my phone, the whole page is covered by the left side menu. Tapping on the burger doesn’t hide the menu either. Not a good impression from a web design library.

Hilarious how the basics keep getting broken despite the huge amount of collective effort to reinvent the basics

Despite? Because of.

Re: Shoelace: A library of web components

#97

I like Tailwind, so I’ve been using Preline and been happy with it. https://preline.co/docs/index.html

I didn't try it out, but usually I'm unhappy with Tailwind based libraries. It just doesn't really fit the concept of Tailwind to use it for a UX library. On one hand those libraries are just a handbook of HTML snippets to copy&paste. On the other hand many of them need some support library, that does some magic in the background that's hard to understand.

The only one I liked so far was shadcn, which is more like a code generator for creating Tailwind based React components.

Re: Shoelace: A library of web components

#98

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 eve…

It's like Bootstrap, but different. Main difference: it's based on Web Components and Javascript, Shoelace won't render anything without Javascript, without the possibility of Server Side Rendering (Shadow DOM requires Javascript)

Bootstrap got kind of stuck in the past. Vanilla Bootstrap is only really usable without a modern frontend framework, as it comes with many Javascript snippets that make the controls interactive. But it's just not really compatible with other UI libraries like React, Vue, etc.

Also Bootstraps feels quite antiquated from a user perspective. And for theming bootstrap you need to go through Sass hell.

I still use it for server side generated HTML, because it's really easy to use and just works.

Re: Shoelace: A library of web components

#99
post #17

I didn't like that the components are all web components with their own shadow Dom inside. Makes styling really hard and didn't work with tailwind for example.

Not just that, but it basically makes the library incompatible with serverside rendering a la Next.js. We actually explored using Shoelace for a project but ended up having to choose something else instead because of this.

True, it completely relies on client side rendering, and it's impossible to render it server side. With disabled Javascript it doesn't show anything at all.

I would really like to use it, but using it feels like limiting your options much more than necessary. Even the CSS-in-JS based libraries (like React MUI) allow SSR to some extent.

Re: Shoelace: A library of web components

#100

Earlier quoted context omitted.

14.3 seems more like "try to degrade gracefully" old rather than "won't support" old...

It’s extremely common to support the two most recent major versions, especially for iOS. It’s great if things work on iOS 14, but it’s been explicitly out of support for over a year in a vast number of organisations.

That's the well-established expectation for iOS.

The web has a pretty different set of expectations, one of the reasons for its success.

Post reply on HN