Our great sponsors
-
shoelace-css
A collection of professionally designed, every day UI components built on Web standards. SHOELACE IS BECOMING WEB AWESOME. WE ARE LIVE ON KICKSTARTER! 👇👇👇
-
prerender
Node server that uses Headless Chrome to render a javascript-rendered page as HTML. To be used in conjunction with prerender middleware.
-
SurveyJS
Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.
-
-
-
ui5-webcomponents
UI5 Web Components - the enterprise-flavored sugar on top of native APIs! Build SAP Fiori user interfaces with the technology of your choice.
-
-
InfluxDB
Power Real-Time Data Analytics at Scale. Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality.
-
-
-
-
Ah, I didn't realize this wasn't solved -- a quick search turns up:
- https://github.com/WICG/webcomponents/issues/788
- https://github.com/w3c/DOM-Parsing/issues/58
- https://github.com/w3ctag/design-reviews/issues/494
- https://web.dev/declarative-shadow-dom
In pre-render they seem to have started in this direction extremely recently:
https://github.com/prerender/prerender/pull/731/files
I don't use prerender so I can't definitively speak to it being solved and hiccup-free, but I think that limitation is going to go away in the future.
As someone who doesn't have a clue about frontend components, but have the desire to build them, how does this compare to https://lit.dev/ ?
I really like the idea of universal web components.
As someone that's done a lot of webcomponent work, this actually looks really solid compared to a lot of other libraries out there. These docs look great too.
All issues I can see are fairly minor. I'd like to see inputs use the native formAssociated api rather than just relying on hijacking FormData (though using the FormData hijack as a fallback). Component scoped design tokens should be part of the `:host{}` style for that component, not in the global scope. Semantic tokens would also be a better approach for improved themability. The localization is hacky, but I'll give the authors major props for actually pushing a suggestion to the spec[1] to allow for better handling in native components.
Some other minor things I'd like to see is performance comparisons with similar React/Vue/Svelte components as well. Webcomponents can fall into poor performance when there are many occurances that overuse observedAttributes.
All in all though, this library looks really great.
[1] https://github.com/whatwg/html/issues/7039
Have you seen OpenUI5 by SAP? -> https://github.com/SAP/ui5-webcomponents
Look neat. They even have Typescript type definitions to it.
I did a simpile test with ScalablyTyped in order to import those into ScalaJS to no avail but there might be a fix.
it's not quite impossible, there are some more "out there" server-side rendering approaches which would work:
- https://github.com/airbnb/hypernova
- https://github.com/prerender/prerender
Fans of efficiency and simplicity might recoil but if it works and is easy to setup, these far out approaches might just catch.
That's the future Shoelace is helping bring about and I think it's a really nice minimally, and paradoxically simple way to build webpages that have the functionality you want without the hassle of heavier frameworks, if you're lucky to find just the right component to spice up your page.
I will say that it's hard to execute cleanly on this vision and it looks like Shoelace is doing a pretty good job -- I made a small contribution to this space[0], and I have to say that getting started with my project is much less clean (as far as dogfooding goes it was functional but didn't taste great!).
Looking forward to trying out Shoelace in the future.
Also heavy mention to tailwind -- the class soup bit is annoying but it's sparked an absolute explosion of reusable templates which I think are helping people build better looking sites faster than ever before. Just like with Bootstrap, of course, we're all getting tired of seeing really similar design elements but the acceleration is probably a net good, even if it requires abusing CSS a little bit.
[0]: https://gitlab.com/mrman/landing-gear/
Ah, I didn't realize this wasn't solved -- a quick search turns up:
- https://github.com/WICG/webcomponents/issues/788
- https://github.com/w3c/DOM-Parsing/issues/58
- https://github.com/w3ctag/design-reviews/issues/494
- https://web.dev/declarative-shadow-dom
In pre-render they seem to have started in this direction extremely recently:
https://github.com/prerender/prerender/pull/731/files
I don't use prerender so I can't definitively speak to it being solved and hiccup-free, but I think that limitation is going to go away in the future.
Ah, I didn't realize this wasn't solved -- a quick search turns up:
- https://github.com/WICG/webcomponents/issues/788
- https://github.com/w3c/DOM-Parsing/issues/58
- https://github.com/w3ctag/design-reviews/issues/494
- https://web.dev/declarative-shadow-dom
In pre-render they seem to have started in this direction extremely recently:
https://github.com/prerender/prerender/pull/731/files
I don't use prerender so I can't definitively speak to it being solved and hiccup-free, but I think that limitation is going to go away in the future.
Ah, I didn't realize this wasn't solved -- a quick search turns up:
- https://github.com/WICG/webcomponents/issues/788
- https://github.com/w3c/DOM-Parsing/issues/58
- https://github.com/w3ctag/design-reviews/issues/494
- https://web.dev/declarative-shadow-dom
In pre-render they seem to have started in this direction extremely recently:
https://github.com/prerender/prerender/pull/731/files
I don't use prerender so I can't definitively speak to it being solved and hiccup-free, but I think that limitation is going to go away in the future.
Hmm, I see that Chromium shipped their implementation a year ago now; I had missed that. Other than that, there’s been no real change in the situation in the last almost two years (since Shoelace 2.0 was released, the last time I examined the situation). And there still doesn’t look to be any real interest in actually implementing it outside of Google: Mozilla are unenthusiastic though not against it <https://mozilla.github.io/standards-positions/#declarative-s...>, and WebKit still find fault with some aspects of the design (https://lists.webkit.org/pipermail/webkit-dev/2021-February/..., https://github.com/mfreed7/declarative-shadow-dom/issues/9), though they’re content most of the earlier issues are ironed out.
So you certainly can’t rely on scriptless server-side rendering of Shadow DOM being possible—it’ll work in Chromium only, and it’ll probably be at least another year or two before other browsers even contemplate doing anything with it.
(And of course, even once Shadow DOM is serialisable, that’s a far shot from a particular frameworky thing being SSR-compatible, but I was quibbling over the Shadow DOM and impossibility aspects, so I shan’t step back on that.)
Hmm, I see that Chromium shipped their implementation a year ago now; I had missed that. Other than that, there’s been no real change in the situation in the last almost two years (since Shoelace 2.0 was released, the last time I examined the situation). And there still doesn’t look to be any real interest in actually implementing it outside of Google: Mozilla are unenthusiastic though not against it <https://mozilla.github.io/standards-positions/#declarative-s...>, and WebKit still find fault with some aspects of the design (https://lists.webkit.org/pipermail/webkit-dev/2021-February/..., https://github.com/mfreed7/declarative-shadow-dom/issues/9), though they’re content most of the earlier issues are ironed out.
So you certainly can’t rely on scriptless server-side rendering of Shadow DOM being possible—it’ll work in Chromium only, and it’ll probably be at least another year or two before other browsers even contemplate doing anything with it.
(And of course, even once Shadow DOM is serialisable, that’s a far shot from a particular frameworky thing being SSR-compatible, but I was quibbling over the Shadow DOM and impossibility aspects, so I shan’t step back on that.)