Perceived sluggish refresh rate

[ubershmekel]

Hi Plotly folks. I think you guys make the prettiest charts but someone asked me today if my charts stutter because of a problem with my machine. He recommended I use dygraphs instead. Compare these two when you mouse over from left to right:

https://plot.ly/~marianne2/1662.embed?autoscale=true&modebar=false&link=false

http://dygraphs.com/

Looking at the profile data on my machine it seems dygraphs has a mouseMoveHandler_ that takes ~0.6ms to run while plotly has maindrag.onmousemove that takes ~3ms. But that's probably not the problem. I think the number 100 ms is pretty bad for fluid motion. This setTimeout may be what's causing it to feel like 10 fps:

plotly.js/src/plots/cartesian/graph_interact.js

Line 294 in 1c79eaa

gd._hoverTimer = setTimeout(function() {

[etpinard]

Thanks for bringing this up.

You're right. We could do a better job at optimizing the picking routine under layout.hovermode: 'x'.

Perhaps simply changing the setTimeout you pointed out to a requestAnimationFrame would be sufficient?

[ubershmekel]

I tried changing HOVERMINTIME to 10 instead of 100. Hovering over a chart with a small amount of data feels much snappier and better. Hovering over a very dense chart makes it feel like the label is moving too fast and noisily. Dygraphs only moves a dot on hover so that feels nice when it's moving along noisy data but plotly has the text of the value itself moving which is too big and offset so it feels wrong when that big unreadable text zips along.

I think 50 ms feels snappy enough without introducing the noisy label zipping. 30 felt too fast as well. These numbers may be subjective so I recommend more people experiment.

[etpinard]

closed in #514