mortyy

графики с большим количеством данных вообще трудно делать, при каком-то размере датасета любой подход перестаёт работать.

конкретно насчёт скорости простой отрисовки, главное - не перекрашивать одни и те же пикселы много раз. если у вас, конечно, не 30 тысяч пикселов в ширину график, то на одну колонку пикселов у вас рисуется много отсчётов. поэтому можно отобрать данные, которые попадают в эту группу, взять из них минимум и максимум (если диапазон не касается прошлого - растянуть до его границы) и отрисовать одной линией.

А почему канвас? На svg как правило все намного проще, особенно если нужна какая-то интерактивность. Если хочется уже готовое - смотреть в сторону того, что посоветовал JRK_DV, если хочется писать свое - то d3.js

var sum = (function() {		
    var currentSum;
    
    return function(a) {
        if(a === undefined) {
          return currentSum
        }
        
				currentSum = a;
        
        function f(b) {
            currentSum += b;
            return f;
        }

        f.toString = function() {
            return currentSum;
        };

        return f;
    }
}())

alert( sum(1)(2) ); // 3
alert( sum(5)(-1)(2) ); // 6
alert(sum()); // 6

https://jsfiddle.net/Lmnv8mxm/

overflow-x: auto

просто скролл горизонтальный

Три курса:
React.js на русском
React + Redux на русском
React + React-router (+ Redux) на русском

Вся информация текстом, можно скачать в формате книги. Почти к каждой главе приложен исходный код.

Вот еще есть прикольный свежий вебинар, недавно сам штырил, очень неплохо. https://youtu.be/0h7eluYJtZc?list=PLHOTezm7WWknic3...