3 ms·

I'm convinced that plain web components are now the best solution for the front end. That said, I don't think any libraries are needed to use them well. Also,

I'm convinced that plain web components are now the best solution for the front end. That said, I don't think any libraries are needed to use them well. Also, I hope that people don't try to implement 'reactivity' in the React way for Web Components... The correct way to handle state changes in Web Components is by changing their attributes and setting up an attributeChangedCallback inside the component (with an observedAttributes getter which lists out the observed attributes). Some people won't like that you can only pass string values to components via attributes (unlike React where you can pass anything) but I swear, if you adapt and force yourself to only pass string values (or stringifiable values), your application architecture will massively benefit. You can still select components and call custom functions/methods on them which lets you pass any value, but I would recommend against for most situations. Attributes are good for handling data going inbound into the component. For outbound data (in the other direction), you should use DOM events. Look into the `bubbles` option when dispatching events. This can be very useful sometimes as it gives you a lot of flexibility; it means that any parent element at any level in the hierarchy can access the data which bubbles up from the child component.

meiraleal 2y ago
> Also, I hope that people don't try to implement 'reactivity' in the React way for Web Components... The correct way to handle state changes in Web Components is by changing their attributes and setting up an attributeChangedCallback inside the component You don't want to update the component on every attribute change as the component might have multiple attributes so you need to batch the changes. Then when changing you also don't want to discard the whole rendered component and render it again. With those 2 things you have React, or much better, without a vdom: LitElement + Lit-html.

meiraleal 2y ago

> Also, I hope that people don't try to implement 'reactivity' in the React way for Web Components... The correct way to handle state changes in Web Components is by changing their attributes and setting up an attributeChangedCallback inside the component You don't want to update the component on every attribute change as the component might have multiple attributes so you need to batch the changes. Then when changing you also don't want to discard the whole rendered component and render it again. With those 2 things you have React, or much better, without a vdom: LitElement + Lit-html.