Fair question.

Mirrored means when you update state, your changes are reflected in the DOM, automagically.

Duplicated means when you change state, you also have to make the changes to the DOM, yourself.

Clear (mostly one-way) data binding is definitely one of React’s strengths.

It appears that Puter handles templating with a pattern like:

  let h = ``
  h += `<div>${exampleContent}</div>`
  h += `<div>${moreExampleContent}</div>`
  $(targetEl).append(h)

And handles events in the traditional way:

  $(targetEl).on('click', function () { /* do stuff */ });

Searching for “React” or “jQuery” in this thread, there are several other conversations with thoughtful comments about pros and cons. One curious tidbit that I learned is that Visual Studio Code doesn’t use a framework either and, like Puter, updates the DOM directly.

The main issue is that "$(targetEl).append(h)" is not idempotent.

This might seem like a small issue on the surface but as your application grows, this either becomes a big problem or you have reinvented React, Vue, or something similar, but without the extensive testing and developer/community availability. Which is essentially what VSCode does for example, using some sort of MVP* pattern.