I can only think that modern front end development has failed

Re:I can only think that modern front end development has fa... by 1337shadow on Sunday April 04, 2021 @02:31PM (#26691736)

Exactly, you can see that the webcomponent I linked is microfrontend. Interestingly, I first ported the code to StencilJS, but then it seemed the framework actually got in my way and I removed it, I prefer the code as is now and there's not even a build because it's vannillajs. You just add the script tag in your page and start using the <autocomplete-light...> tags with your options. I used the mdn custom element documentation without any framework.

[ Parent | on HN ]

Re:I can only think that modern front end development has fa... by JMTQp8lwXL on Sunday April 04, 2021 @02:43PM (#26691801)

I like what I'm seeing in Web Component technology, but it's not fully there for me yet.

Suppose your base Design System is web components. Most Microfrontend (MFE) teams will still pick up an off-the-shelf React, Vue, Angular, etc.

But VDOM and web components don't always play nicely. If you have Parent-Child web components, specifically 1 parent with N-immediate children, React can't resolve this gracefully. Every render past the first breaks with Stencil. That's a pretty significant issue, because (very) common components like Select dropdowns are modeled as 1 parent with N immediate children.

So you can't any longer stay in React's declarative model. The workaround (last comment in issue) has you writing imperative code to fix the problem.

It has that "using D3 in React" vibe to it. It works, but it's not nearly as elegant as if you had, say, a React-based Design System (but then, of course, all your MFE teams must use React).

https://github.com/ionic-team/stencil/issues/2259

Users have also reported the same analogous issue exists for using Web Components in Vue too, so it's not even a React-specific shortcoming.

https://github.com/ionic-team/stencil/issues/2259#issuecomme...

[ Parent | on HN ]

Re:I can only think that modern front end development has fa... by 1337shadow on Sunday April 04, 2021 @03:10PM (#26691992)

I don't think it matters so much for React/Angular/Vue to support web components because they will be dropped in favor of vanilla js just like jQuery has, thanks to Custom Element which is recommended for MFE, and ESM which will likely be. Mixing different frameworks is a promise that I don't care about, but you got some pretty interesting feedback about it, seems like it might as well take a few years of effort.

[ Parent | on HN ]