Skip to content

Commit 759f68b

Browse files
committed
Mobile support: Instant move response via timer updates
Problem: When updating many elements mobile device queues slow changes. So even after touch up, you can se changes caching up. Solution: Update virtual dom/model instantly, but render dom via timer, so queues of slow HTML updates could be skipped. Resulting in more natural response. This will be very useful for more complex GUI interactions (E.g, zooming using touch screen).
1 parent 50c81bb commit 759f68b

File tree

1 file changed

+14
-13
lines changed

1 file changed

+14
-13
lines changed

js/src/main/scala/com/auginte/eventsourced/MainJs.scala

+14-13
Original file line numberDiff line numberDiff line change
@@ -66,17 +66,29 @@ object MainJs extends JSApp {
6666
onReady {
6767
val updatesPerSecond = 60
6868
Async.timer(1000 / updatesPerSecond) {
69+
def render(root: Element) = {
70+
def clearChilds(root: Element): Unit = {
71+
root.innerHTML = ""
72+
}
73+
74+
clearChilds(root)
75+
root.appendChild(div(controls.render).render)
76+
root.appendChild(elements.domElements.createDomElement(dom.document))
77+
DEBUG.repainted()
78+
}
79+
6980
DEBUG.frames += 1
7081
if (needUpdate) {
7182
needUpdate = false
83+
val root = dom.document.getElementById("root")
84+
render(root)
7285
}
7386
true
7487
}
7588
DEBUG.framesPerSecond()
7689

7790
// Data model
78-
val root = dom.document.getElementById("root")
79-
ElementsApp.subscribe(ElementsApp.zoom(identity))(_ => render(root))
91+
ElementsApp.subscribe(ElementsApp.zoom(identity))(_ => needUpdate = true)
8092
ElementsApp(Empty)
8193

8294
// Updates from server
@@ -87,15 +99,4 @@ object MainJs extends JSApp {
8799
source.addEventListener[MessageEvent]("message", messageHandler, useCapture = false)
88100
}
89101
}
90-
91-
def render(root: Element) = {
92-
def clearChilds(root: Element): Unit = {
93-
root.innerHTML = ""
94-
}
95-
96-
clearChilds(root)
97-
root.appendChild(div(controls.render).render)
98-
root.appendChild(elements.domElements.createDomElement(dom.document))
99-
DEBUG.repainted()
100-
}
101102
}

0 commit comments

Comments
 (0)