Search code examples
javascriptpythonpython-3.xperformancebokeh

How to call a JS function or Python method when a glyph is completely rendered?

I am using bokeh as a Server Application. When I make a selection in a plot I do some actions in python and I update some sources (CDS). This changes are reflected in the plot. Is there a way to check when the glyphs are completely rendered (after the update)? I want to call a JavaScript function when all is completely loaded? With that function I want to call other python method to update the CDS again.

If I do not wait for this profiles to be rendered probably the application breaks, and that´s what I want to avoid. Actually I did some tests in the past and I had to create a huge CDS instead of several smaller CDS to make it work properly.

My Use Case. Why do I want to make this?

I have many tabs in my layout, they can be 10 for example. And each tab has some plots (3-6 plots). If I update the entire ColumnDataSource at the same time, it will take a while. Then I want to make it more fluent, so I would like to update only the data of the current visible tab, it will render faster and the user would receive an immediate response. I can disable the rest of the tabs temporarily to prevent malfunctions. At this moment I would need to call the JS or python method in order to update the content of the rest of the tabs.

Here a drawing of what I want to achieve in order to speed up the process:

drawing_steps

About the data

Basically I have two DataFrames, one to build the cloud of points (around 5000 row and 130 columns) and I extract from the selected points another DataFrame to know which lines I should draw (360 columns and 5 to 15 rows), making some filters and selections. The algorythm I have used is in the answer of a question I have written time ago. With this amount of data the algorythm takes 6 or 7 seconds to finish.

Any other idea of how to improve the performance or how to split or the computing?

Solution

  • Time ago I made a trick to check if my design would work if I could trigger some function if the plots were rendered:

    1. First I updated the current tab. This worked very well and fast.
    2. Then I set a timeout to update the data of the rest of the tabs. But, in the meantime this second algorythm was being executed I could not work with the plots of the current tab because they were frozen.

    So, the approach of triggering a function when everything is rendered is not a good idea, because even with such a callback the app would not work as I was expecting.