Heatmap rendering performance when many slider steps

Hi,

This one is somehow related to https://github.com/plotly/plotly.js/issues/6521 but slightly different.

• when working with 1000 slider steps (Plotly slider), the rendering of this heatmap is quite slow (between 1 and 2 frames per second when moving the slider): https://jsfiddle.net/wh1o2pyq/1/

• When working with 50 slider steps (Plotly slider), the rendering is super fast (more than 10 fps): https://jsfiddle.net/wh1o2pyq/2/

• When working with 1000 slider steps but with a HTML slider instead of the Plotly slider (<input type="range">), it is super fast: https://jsfiddle.net/5L9ykt76/

TL;DR: Plotly slider with many hundreds of steps seems to be a bottleneck for heatmap rendering

Does this mean the slider itself is re-rendered for each update, making the whole thing slow?

I believe that solving this issue could have massive improvement on the responsiveness of every Plotly/Dash dashboard using sliders :)

Any idea?

リンクされている3つのJSFiddle再現から始め、50ステップおよび1000ステップのPlotly sliderとHTML range sliderを比較します。ボトルネックを特定するために、sliderの更新とheatmapのレンダリングをプロファイリングします。1000ステップのPlotly sliderが、報告されているheatmapの挙動を変更せずに大幅に速く応答すれば完了です。