speedup import by bulk-updating DOM every 50 styles or 1 sec

This commit is contained in:
tophf 2017-04-12 18:31:52 +03:00
parent 1749057b91
commit 4f2ccbe6cb

View File

@ -67,7 +67,10 @@ function importFromString(jsonString) {
invalid: {names: [], legend: 'invalid skipped'}, invalid: {names: [], legend: 'invalid skipped'},
}; };
let index = 0; let index = 0;
let lastRepaint = performance.now(); let lastRenderTime = performance.now();
const renderQueue = [];
const RENDER_NAP_TIME_MAX = 1000; // ms
const RENDER_QUEUE_MAX = 50; // number of styles
return new Promise(proceed); return new Promise(proceed);
function proceed(resolve) { function proceed(resolve) {
@ -100,10 +103,13 @@ function importFromString(jsonString) {
reason: 'import', reason: 'import',
notify: false, notify: false,
})).then(style => { })).then(style => {
handleUpdate(style, {reason: 'import'}); renderQueue.push(style);
if (performance.now() - lastRepaint > 1000) { if (performance.now() - lastRenderTime > RENDER_NAP_TIME_MAX
scrollElementIntoView($('#style-' + style.id)); || renderQueue.length > RENDER_QUEUE_MAX) {
lastRepaint = performance.now(); renderQueue.forEach(style => handleUpdate(style, {reason: 'import'}));
setTimeout(scrollElementIntoView, 0, $('#style-' + renderQueue.pop().id));
renderQueue.length = 0;
lastRenderTime = performance.now();
} }
setTimeout(proceed, 0, resolve); setTimeout(proceed, 0, resolve);
if (!oldStyle) { if (!oldStyle) {
@ -126,6 +132,8 @@ function importFromString(jsonString) {
}); });
return; return;
} }
renderQueue.forEach(style => handleUpdate(style, {reason: 'import'}));
renderQueue.length = 0;
done(resolve); done(resolve);
} }