скорость рисования «постоянно непостоянная» ⇐ Javascript

[Anonymous]

Я измеряю, сколько времени занимает рисование на . Я ожидал, что рисование одинаковых линий займет одинаковое количество времени.
Но в Chrome каждые 43692 строки происходит задержка, которая в 200 000 раз дольше, чем обычно. В Firefox проблема начинается позже, но потом происходит чаще (см. первую версию этого поста - там были менее наглядные, но более очевидные проблемы Firefox). Достаточно ответа для одного из браузеров.
Браузеры искусственно замедляют операции рисования ? Какой алгоритм/правила используете?
Или сборщик мусора запускается детерминированно после определенного количества нарисованных линий?
Это важно для планирования проектов и для того, чтобы не вводить в заблуждение тестами.
Обычные экраны имеют несколько миллионов пикселей, поэтому, очевидно, браузер искусственно не позволяет нам заполнять 2D-холсты деталями при высокой частоте кадров.

Код: Выделить всё

const ctx = canvas.getContext('2d');
const chartCtx = chart.getContext('2d');

button.onclick = () => {
const n = +input.value;
const times = [];

// Repeatedly draw identical lines and time that
const start = performance.now();
for (let i = 0; i < n; i++) {
ctx.beginPath();
ctx.moveTo(0, 0);
ctx.lineTo(100, 100);
ctx.stroke();
times.push(performance.now() - start);
}

// Draw chart: x = time, y = iteration count
const maxTime = times[times.length - 1];
chartCtx.clearRect(0, 0, chart.width, chart.height);
chartCtx.beginPath();
chartCtx.moveTo(0, chart.height);
for (let i = 0; i < times.length; i++) {
const x = (times[i] / maxTime) * chart.width;
const y = chart.height - ((i + 1) / n) * chart.height;
chartCtx.lineTo(x, y);
}
chartCtx.stroke();
};

Код: Выделить всё

#canvas {
display: none;
}

Код: Выделить всё

Run


Number of drawn lines as a function of time:

Подробнее здесь: https://stackoverflow.com/questions/798 ... consistent