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?

从三个已链接的 JSFiddle 复现开始，将具有 50 步和 1000 步的 Plotly slider 与 HTML range slider 进行比较。对 slider 更新和 heatmap 渲染进行性能分析，以确定瓶颈；当 1000 步的 Plotly slider 的响应速度显著提升，且不改变已报告的 heatmap 行为时，即视为完成。