Canvas starts having problems when drawing more than 100K points at a time.
- 2m – ~1 / 15 fps = 130K dots/sec (but startup is noticeable)
- 1m – ~ 1 / 7 fps = 180K dots/sec (ditto)
- 500K – ~1 / 2 fps = 206K dots/sec (ditto)
- 200K – ~1 fps = 240K dots/sec
- 100K – ~3 fps = 310K dots/sec
- 50K – ~6 fps = 320K dots/sec
- 10K – ~32 fps = 320K dots/sec
- 5K – 60 fps = 300K dots/sec // maximum fps (frames/sec)
Chrome & Firefox max speed: ~320K dots/sec.
Safari max speed: ~200K dots/sec (39 fps for 5K points).
Bottom line: Use context.fill() every ~5-50K points for more than 100K total points.