I am trying to make a dashboard that displays multiple plots simultaneously. My problem is that each time I wheel zoom or pan, BokehJS
executes compute_layout
, which starts at 10-20 ms duration for a single plot but increases to 400ms for 30 plots, and it gets worse if I add extra layout elements. Do you have any suggestions or techniques I could use to improve the user experience?
To reproduce, I recommend setting the env var and opening the JavaScript console in the browser
export BOKEH_LOG_LEVEL=debug
from bokeh.layouts import gridplot
from bokeh.models import ColumnDataSource
from bokeh.plotting import figure, curdoc
from bokeh.plotting import figure
import pandas as pd
import numpy as np
N = 1000
def make_data(N):
data = pd.DataFrame(np.random.random(N*2).reshape(N, int(2)), columns=['x', 'y'])
return ColumnDataSource(data)
plots = []
for i in range(50):
source = make_data(N)
p = figure(title=f'Figure {i}', tools=['wheel_zoom', 'pan'], active_scroll="wheel_zoom", width=300, height=300)
p.circle(x='x', y='y', source=source)
plots.append(p)
gp = gridplot(list(zip(plots[::2], plots[1::2])))
curdoc().add_root(gp)
Note: I am aware of people having problems loading large layouts Browser rendering extremely slow when many figures in a gridplot · Issue #6294 · bokeh/bokeh · GitHub. In this case, loading the page is not an issue.