list perf: re-render list at most once per second
This should at least keep the browser somewhat usable even if lots of updates are received from server.
This commit is contained in:
parent
1c6c8b0e02
commit
c7b051e73b
|
@ -10,6 +10,8 @@ export class ListView extends View {
|
||||||
|
|
||||||
constructor () {
|
constructor () {
|
||||||
super();
|
super();
|
||||||
|
this.lastRenderTime = null;
|
||||||
|
this.deferredRenderTimer = null;
|
||||||
const table = domlib.newAt(this.el, 'table'),
|
const table = domlib.newAt(this.el, 'table'),
|
||||||
thead = domlib.newAt(table, 'thead');
|
thead = domlib.newAt(table, 'thead');
|
||||||
|
|
||||||
|
@ -386,6 +388,28 @@ export class ListView extends View {
|
||||||
if (this.editing && this.tbody) {
|
if (this.editing && this.tbody) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// render at most once every 1000 msec
|
||||||
|
const nowTime = Date.now();
|
||||||
|
if (this.lastRenderTime != null) {
|
||||||
|
const timeSinceLastRender = nowTime - this.lastRenderTime,
|
||||||
|
maxRenderDelay = 1000;
|
||||||
|
|
||||||
|
if (timeSinceLastRender < maxRenderDelay) {
|
||||||
|
console.log("deferring render() impl");
|
||||||
|
if (this.deferredRenderTimer == null) {
|
||||||
|
this.deferredRenderTimer = setTimeout(() => {
|
||||||
|
console.log("doing deferred render() impl now");
|
||||||
|
this.render();
|
||||||
|
this.deferredRenderTimer = null;
|
||||||
|
}, maxRenderDelay - timeSinceLastRender);
|
||||||
|
}
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this.lastRenderTime = nowTime;
|
||||||
|
console.log("immediate render()");
|
||||||
|
|
||||||
while(this.tbody.hasChildNodes()) {
|
while(this.tbody.hasChildNodes()) {
|
||||||
this.tbody.removeChild(this.tbody.firstElementChild);
|
this.tbody.removeChild(this.tbody.firstElementChild);
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue