Re:Use web components for what they’re good at
by troupo on Friday August 25, 2023 @08:21AM
(#37260863)
> The simplicity of Web Components forces you to plan ahead a little bit more and to architect your app
Not really. The perceived simplicity of Web Components makes you deal with issues that you should never have to deal with, and reinvent your own libraries and frameworks for even the simplest things, and you will still run into unexpected gotchas.
Especially if your components will be used by others (cross-root ARIA, SSR, styling, proper form participation etc.).
But even for what are not even supposed to be issues. It's a good thing you mentioned an input box. Properly re-rendering an input box in response to certain events or state changes will be either lots of tedious manual work, or running into issues like losing focus, user input, and values. And there's literally nothing in web components to help you with that: use or create your own library to deal with it.
The behaviour you described for Vue is surprising though...
> I don't run into these issues when using Web Components because I have full control over the rendering.
Not really you don't. For example, web components are eagerly rendered, and there's really not much you can do to prevent a rendering cascade when in reality you want something to load and render lazily.
You can't coordinate between various components on the page, so they will all have their own idea of when to render.
Not really. The perceived simplicity of Web Components makes you deal with issues that you should never have to deal with, and reinvent your own libraries and frameworks for even the simplest things, and you will still run into unexpected gotchas.
Especially if your components will be used by others (cross-root ARIA, SSR, styling, proper form participation etc.).
But even for what are not even supposed to be issues. It's a good thing you mentioned an input box. Properly re-rendering an input box in response to certain events or state changes will be either lots of tedious manual work, or running into issues like losing focus, user input, and values. And there's literally nothing in web components to help you with that: use or create your own library to deal with it.
The behaviour you described for Vue is surprising though...
> I don't run into these issues when using Web Components because I have full control over the rendering.
Not really you don't. For example, web components are eagerly rendered, and there's really not much you can do to prevent a rendering cascade when in reality you want something to load and render lazily.
You can't coordinate between various components on the page, so they will all have their own idea of when to render.