Python interactive window drops fps when creating many plots - SVG rendering is slow

[janosh]

Not sure how hard it is to do anything about this but I noticed that if the Python interactive window contains lots of plots already (above maybe 30), adding new ones brings the frame rate down quite significantly. Above around 60 plots, it's at less than 1 fps and makes all of VS Code become unresponsive. Once the plots are done, VS Code (including the interactive window) returns to normal.

Here's some example code to reproduce the issue.

#%%
import matplotlib.pyplot as plt
import numpy as np

for i in range(100):
    plt.plot()
    N = 50
    x = np.random.rand(N)
    y = np.random.rand(N)
    colors = np.random.rand(N)
    area = (30 * np.random.rand(N)) ** 2  # 0 to 15 point radii
    plt.title(f"plot #{i + 1}")
    plt.scatter(x, y, s=area, c=colors, alpha=0.5)
    plt.show()

[kbc8894]

after latest update I have same problem. please fix it!

[rchiodo]

Rendering to png instead of svg might speed this up.

Try adding this cell first:

%config InlineBackend.figure_format = 'png'

[rchiodo]

Note, that change eliminates the ability to expand the plots later.

[rchiodo]

Yeah that makes it a lot faster for me.

In our insider's build there's a way to do this automatically. Turn this setting off:

The problem is the web page we load is much slower displaying SVGs versus PNGs.

[janosh]

I'd really like to keep the ability to zoom into plots. Not sure if this was already considered but if the number of rendered elements are a problem, I believe <canvas> generally offers much better performance than SVGs. I remember reading the former scales as O(resolution^-1) whereas the latter scales with O(# of elements^-1).

[greazer]

Possible solution - Generate PNGs along with the SVG, but only display the PNG in the history window. When the plot viewer opens, use the SVG.

[kbc8894]

@rchiodo thanks! It works!

[rchiodo]

@DavidKutu my fix for #3233 should fix this too.

[DonJayamanne]

@rchiodo isn't virtualizing an option?

[rchiodo]

@DonJayamanne yes we want to do that too. Something like this looks promising:
https://github.com/twobin/react-lazyload

However, SVG is a lot slower than PNG. We can fix jupyter to generate both.

[ParteekSJ]

Possible solution - Generate PNGs along with the SVG, but only display the PNG in the history window. When the plot viewer opens, use the SVG.

How do I do that?

[janosh]

@ParteekSJ Nothing you have to do. This is something the Jupyter extension now does internally.

[ParteekSJ]

@ParteekSJ nothing you have to do. This is something the Jupyter extension now does internally.

Thank you.