DOM updates are not batched, causing visible flicker

[Aivean]

Describe the bug

Here is my minimal example: https://gist.github.com/Aivean/f4e7c0b15a860685f2eff7814b1ffa99

It renders a list that can be "navigated" by pressing Up and Down arrows. On a single keypress, next/previous element becomes active and current element becomes inactive.

Demo:

Each list element is rendered using render over correctly mapped KVar, and, as could be seen from websocket log, on single keypress only two affected list elements are updated. However, because changes to these two elements are applied one by one, it causes visible flicker (as could be seen on the gif above). I.e. there are rendered browser frames, when changes are applied partially, when one list element is removed, but not yet replaced by the new element.

This is different from how, for example, React + Mobx would behave.

To Reproduce

Run the linked example. Navigate list by pressing Up or Down arrow, observe flicker.

Expected behavior

Dom changes triggered by single KVar change should be batched and applied on the client within a single requestAnimationFrame.

[Derek52]

I just released version 0.10.0 that fixes this issue.