Live data from Hacker News

Web Components Eliminate JavaScript Framework Lock-In

jakelazaroff.com

171–180 of 300 posts

Re: Web Components Eliminate JavaScript Framework Lock-In

#171

I've found webcomponents to be really good at encapsulating anything that doesn't directly query application state. Specifically there are two type of components that really thrive as web components (as opposed to react): 1. Highly interactive components - Components that implement complex interaction management (but sort of agnostic to application state) are ideal web components. You don't need to mess around with `…

I completely agree. Recently I listened to a podcast where Brad Frost talked about web components being useful for design systems, as you can make a button in a web component and have that defined no matter what JS framework the dev team (or teams) want to use company-wide.

One issue I see though and I almost feel dumb for saying it, I don't like how web component code looks. Using innerHTML feels really weird when your team is so used to using JSX for react components for example. I don't think this would stop me from researching web components more but does anyone feel similarly or have a solution or obvious answer for me in this area?

Re: Web Components Eliminate JavaScript Framework Lock-In

#172
post #39
post #6

One of the linked articles [1] makes an interesting claim that feels like a reach to me, but I'd be interested in hearing HN's take on it: > At this point React is legacy technology, like Angular. Lots of people are still using it, but nobody can quite remember why. The decision-makers in organisations who chose to build everything with React have long since left. People starting new projects who still decide to buil…

"Lots of people are still using it, but nobody can quite remember why." I can remember why. This, and every other article I've ever read arguing to replace React with Web Components, completely misunderstands the point of React. It isn't about JSX. It isn't about encapsulation. It isn't about reusability. It is about enabling a design pattern where *the user interface is a pure functional transformation of the applic…

> (B) Advocate a framework other than React that uses the same pattern as React, but improves the usability. I think the two places there is the most room for improvements are:

> 1. Animations

> 2. useEffect() in general

I'm not normally one to "shill" a web framework, and I still mainly use (and love) React, but I'm curious if you've tried Svelte, because it definitely manages animations better than React, and has a different idea of state that's more ergonomic for many use cases (though I won't go so far as to say it's definitively "better" than useEffect)

Re: Web Components Eliminate JavaScript Framework Lock-In

#174
post #43

Web components are a half-baked solution. It only becomes useful with another framework (even if it's very lightweight) like lit. At which point I might as well use vue/react/svelte since I am already brining in a library. Tech like preact is really lightweight as well, and given the popularity of react, is enough to offset any benefits web components have. I would really like it if we reached a point where a web pro…

"half-baked solution" Can you elaborate further ? Anything that removes dependencies from external libraries is a huge plus for me so I am curious as someone who is not great at JS.

> Can you elaborate further ?

As you read the following, keep in mind that at this time Web Components have been in development for almost 12 years.

The core is just three standards, CustomElements, Shadow DOM and HTML Imports (already deprecated and removed in favor of JS-only imports). And people will go out of hteir way to sell you the idea that this is lightweight, all that you need etc.

However.

They've already spawned half a dozen new web standards just to deal with issues they inflicted on themselves. None of these issues are present in any other solution/lib/framework that exists.

These range from the fact that web components cannot participate in forms (fixed with a new spec: https://web.dev/articles/more-capable-form-controls) to their inability to share stylesheets (fixed with a new spec: https://web.dev/articles/constructable-stylesheets) to whatever else (hard to keep track).

They will need at least 20 more new web standards to fix other issues that, once again, are not a problem for literally every other framework, library, or hand-written code under the sun: https://w3c.github.io/webcomponents-cg/2022.html.

Among my favorite ones: a web component button cannot be a submit button in a form; you cannot reference an id inside a shadow root, and that breaks ARIA.

To call them half-baked is an understatement. They are badly thought-out, badly implemented APIs with no forethought or visible planning, and literally no end goal in sight. The people building this met to hash out what more is needed for them to be complete only last year, 11 years into development. All development before that looked like ad-hoc patches by people surprised that a yet another thing doesn't work, but is sorely needed.

Re: Web Components Eliminate JavaScript Framework Lock-In

#175
post #6

One of the linked articles [1] makes an interesting claim that feels like a reach to me, but I'd be interested in hearing HN's take on it: > At this point React is legacy technology, like Angular. Lots of people are still using it, but nobody can quite remember why. The decision-makers in organisations who chose to build everything with React have long since left. People starting new projects who still decide to buil…

Yes, I agree with him. What's the reason to use React? It is over-engineered and too complicated for no clear benefit. It takes longer to build an app using react just because you have to deal with things that are exclusive to react

Re: Web Components Eliminate JavaScript Framework Lock-In

#176

Web Components are not a replacement for React. They are a thing you would use to build React if you were to do so today. To use only Web Components, you will be writing a lot of low-level code using the browser's API, or you will have to use a framework built on Web Components

> They are a thing you would use to build React if you were to do so today.

No, you wouldn't. Very few JS frameworks (however new they are) use web components as their foundation for many, many, many reasons.

Re: Web Components Eliminate JavaScript Framework Lock-In

#177
post #116

Earlier quoted context omitted.

I work at a big org and we use Stencil to produce UI kits using web components. In my experience and the anecdotal experience of the people in adjacent orgs that work with web components too: Its still a shit show.

Yes, the Web Components spec is incomplete and not adequate for real-world use currently. But the end state will be as a compilation target, not as a development platform.

We're still at least 20 specs away from them being "adequately specced": https://w3c.github.io/webcomponents-cg/2022.html

And there are multiple other issues that make web components a very unattractive compilation target.

Re: Web Components Eliminate JavaScript Framework Lock-In

#178

I like the idea of web components, but really dislike html and js being intermingled (the reason I don't like React/JSX). In web components its even worse because its HTML as a string which means it has no validation and isn't syntax aware. I much prefer the angular approach where you have separate css,html,ts files, and would love a web component framework that could work similarly. Searching for this I found some k…

Rather than putting the HTML in JS, you can fetch HTML in the JS.

E.g. https://github.com/g-utils/WebComponentFactory

Re: Web Components Eliminate JavaScript Framework Lock-In

#179
post #166

Earlier quoted context omitted.

Lit's features are internal to each component (except context which is being developed as an open community protocol with the Web Components Community Group) and there is no coupling between components written in Lit. So you can port from Lit to something else component-by-component. Lit is also modular. The template library, lit-html, is usable independently and used by other web component and non-web component libr…

This is just splitting hairs in an attempt to pretend that lit isn't a framework (or framework-like lib), or that it's somehow unopinionated, or that it somehow prevents you from lock-in. Almost all of the things you listed are specific to lit, and lit only. So, people who will develop with lit will be locked in to lit. Because it's not like you can just pop the code you wrote with lit into stencil or ionic, and will…

> I personally saw a huge project ported from Angular to React basically doing the same.

Do Angular and React components talk to each other? Lit and other Web component frameworks can share components. To refactor Lit components into other web component framework or raw web component is orders of magnitude easier than converting Angular React.

Re: Web Components Eliminate JavaScript Framework Lock-In

#180
post #35

Earlier quoted context omitted.

> React “won” because Facebook spent three years flying devrel to every web conference You do know that Google sponsored and ran things like Polymer conf? That it builds lit? That Google's devs have literally overrun and overruled most web specs committees? That Google has spend hundreds of millions of dollars promoting Web Components? And yet here we are.

I'm glad to have read this today. I'm going to look into how I could use web components in my next side project. I'd really like something that worked easily with SSR and client-side, maybe using htmx. In retrospect, I think I avoided web components because of Google and their aggressive dev relations pushing Polymer. It felt so one-sided that it didn't seem like a web standard. It felt more like a Google "standard"…

> I'd really like something that worked easily with SSR and client-side

Then you should skip Web Components :)

Post reply on HN