Afterthoughts around about Kernel code and custom operators complaints

HTML elements are not stateful, DOM is. Bindings provided by VirtualDom are not stateful even though they might result in producing stateful DOM (which I’ve described in post above precisely because I expected reaction like this). With any vdom implementation, a lot of effort goes into tuning diffing algorithm in a way that these states won’t mess up on user.

Example 1: Global State

Now have a look at this https://ellie-app.com/8DhgqBYnXvfa1 and try to increment and decrement the counter. This shows how purity can be broken with web component. Call to pure function Html.node "x-state" mutates global state every time diffing algorithm adds this node into the DOM.

Example 2: Node State Loss

Survival of local state of a component depends on diffing algorithm. This means that if diffing algorithm decides that it will remove the node and insert the new instance, the state of the component is lost.
This is demonstrated by this example https://ellie-app.com/8DhvpDkLdMKa1.
Even inputs and other things suffer from this issue. Anyway I don’t think it’s wise to make this issue in your app even worse by adding tons of additional state using web-components api.

2 Likes