I’ve been tasked with figuring out why graphs on our website are not loading quickly. After playing around with Chrome development tools, I found the issue. Within the call for plotly, it often has to call layout and Reclculate style, from what I’ve read online this is an unnecessary step. Would anyone happen to know if Plotly often has this issue or if it has to do with the data format I’m putting into plotly?
Hi, could you share a reproducible example to help us debug?
If not, maybe you could tell us how you’re plotting your graphs. Things like:
- what are your
layout.marginsettings? - are you using a
{responsive: true}config? - are you using
automargin: truein your axis setting? - do you have a legend and or colorbar on your graph?
are all things that could help us pinpoint the problem and find a solution.
Thank you!
I cannot post full snippets, but I can anwer all of those questions
-
My margin settings are
margin: { l: 50, r: 30, b: 50, t: 30, pad: 10 } -
I never specified a config setting before, after reading your post I tried making a config setting that has responsive = true and it sped up the process slightly (not by a lot but noticeable)
-
I am not using automargin = true in the axis settings
-
There is a legend in the graph, but I don’t specify it, it shows up automatically
For more info on the plot itself, I take strings, turn them into floating points, and then plot them against dates (they are kept as date objects). I do this for multiple sets of prices/dates and get an array of arrays. According to the devl tools this process does not take long at all and is not the source of the hold-up.
Below is another picture of the devtool output and what it says is the issue, all those purple specks are either Recalculate style or Layout (anything with a tiny red flag is forced). Would any of the specs I told you about have to do with the issue?
Thank you for the reply!