Please have a look at this heatmap:
It takes 5 seconds to render the colors.
Any idea why?
The heatmap itself should render pretty fast. I think the problem is with the text annotations.
You might want to read https://github.com/plotly/plotly.js/issues/1115 for possible solutions.
Thanks @etienne.
Without annotations it is faster, but still sluggish.
You can see here I added a parameter to skip annotations:
Ok. Maybe something is up with your code then. Would you mind sharing a snippet with us to help us debug?
Thanks @etienne. Sorry for the delayed response.
Here is a simple example. This page has only render data embedded in the page and the render call. As you can see it is unusable. It improves somewhat removing annotations (which we need, so that’s not an option) however it is still unusable.
I’m going to experiment with other ways of generating these heatmaps. Hopefully you guys can figure out what’s going on here.
http://s3-us-west-1.amazonaws.com/tapcast-bi/app/performance-example.html
Thanks!
For comparison, here is an example with Highcharts (different sample data set from their examples).
I tried the same heatmap on highcharts. It was also slow with the labels, but super fast without them.
Here’s a few things you can do to help performance:
<script>
tag, looks like you’re not using any LaTeX symbol so don’t make plotly.js unnecessary try to parse them (yeah, plotly.js is a little dumb in its handling of MathJax at the moment)scatter
trace of mode: 'text'
instead of 100+ annotations items. See example: http://codepen.io/etpinard/pen/YZbEGa