DOM: innerSmartHTML proposal

Hi mailinglist members,

Sorry, if this has been discussed before. I actually wouldn't be surprised
if it has been. However I thought it was an interesting idea to share, so
here goes :-).

The idea is to create a property, which I will call 'innerSmartHTML' for
now, that shares some characteristics with innerHTML, but with some
differences:

   - Only change what has really changed (like the ReactJS virtual DOM does)
   ---
   So if I have node.innerHTML = "<div><b class="x">something</b></div>";

          and after that say node.innerSmartHTML = "<div><b class="x
y">something</b></div>"

          Only the class of b should have been modified, instead of
recreating everything as innerHTML does. Of course, adding and removing
nodes should also be supported.

   - perform rendering during requestAnimationFrame
   ---
   aggregate all changes to perform them at once, instead of immediately. I
   understand this will be challenging to do with the current DOM methods in
   place, but I'm hopeful we can find something that works within the current
   boundaries of the DOM.

Why do I think this is an interesting idea? Because it significantly
simplifies working with the DOM.

Good idea? Bad Idea? Let me know :-).

Kind regards,

Sander
ps. I also send this idea to @w3c and @annevk on Twitter today, but didn't
get a response - so thought it might be wiser to post it here.