speedup import by bulk-updating DOM every 50 styles or 1 sec
This commit is contained in:
parent
1749057b91
commit
4f2ccbe6cb
|
@ -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);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue
Block a user