из-за моего объема данных, я пытаюсь отобразить их в несколько раз, по наименьшей сумме, благодаря requestAnimationFrame. Я новичок в этом методе и имею некоторые проблемы с ним., от которого зависят параметры requestAnimationFrame? - медленность
Он хорошо работает для небольшой базы данных с менее чем 1000 записей, что является гладким. Но когда я пытаюсь использовать его с большими базами данных, цикл уже не является гладким. Я не понимаю эту медлительность, потому что обычно рендеринг делает то же самое, независимо от размера «данных».
function paths(data, ctx, count) {
var n = data.length,
i = 0,
reset = false;
var lastRun=0;
var fps;
function render() {
var max = d3.min([i+60, n]);
data.slice(i,max).forEach(function(d) {
d3.select(".foreground")
.append("path")
.attr("d", function(p){ return path(d);
})
.attr("stroke", "steelblue");
});
i = max;
console.log("end render");
};
(function animloop(){
console.log("animloop");
if (i >= n || count < brush_count) return;
lastRun = new Date().getTime();
requestAnimationFrame(animloop);
render();
})();
};
// Returns the path for a given data point.
function path(d) {
return line(dimensions.map(function(p) {
return [position(p), y[p](d[p])]; }));
}
Я пытался увидеть, где медленность приходит, благодаря console.log(), но на самом деле замедленной после визуализации. На консоли печатаются блоки «end render - animloop»/a lapse/«end render - animloop». Я не понимаю этот пробел ...
Когда я пытаюсь использовать отладчик шаг за шагом, я не вижу никакой разницы между случаями «несколько данных» и «большими данными».
Если кто-то видит проблему в моем коде или знает происхождение проблемы, я буду очень благодарен.
PS: скорость теперь: 50 кадров в секунду для 500 записей, 15 кадров в секунду для 7000, 5 кадров в секунду для 20 000 (мне не нужно 60 кадров в секунду, но 5 действительно недостаточно).
Вы имеете в виду 'requestAnimationFrame' вместо' requestAnimFrame'? –
Да, извините. Я редактирую вопрос –
requestAnimationFrame запрашивает следующий анимационный фрейм из браузера, но это происходит после того, как ваша обработка имеет место, конечно, поэтому, если у вас много вычислений или распределение памяти происходит, тогда это будет замедляться, чтобы сделать это прежде чем он сможет получить анимационный кадр для отображения. Вам нужно будет посмотреть на кеширование ваших данных или перепроектировать то, что вы делаете. – ManoDestra