Skip to content

Avoid expensive over-computing "all models" on Document init #11707

@EfremBraun

Description

@EfremBraun

Originally posted here: https://discourse.bokeh.org/t/poor-scaling-when-embedding-many-widgets-into-the-jinja-template/8456.

ALL software version info (bokeh, python, notebook, OS, browser, any other relevant packages)

Bokeh 2.4.0
Python 3.9.6
MacOs Catalina 10.15.7
Google Chrome 94.0.4606.61

Description of expected behavior and the observed behavior

I’ve been seeing poor runtime performance with my Bokeh application. After seeing https://discourse.bokeh.org/t/bokeh-version-0-12-10-incredibly-slow/2772, and noticing that my Console is giving me a lot of warnings about layout computes taking a long time, I decided to try using Bootstrap to layout the application, embedding individual Bokeh components into it.

This greatly improved the runtime performance. However, the loading time of the website is now quite abysmal. Running Chrome’s Lighthouse Audit (https://developer.chrome.com/docs/devtools/speed/get-started/), I see that the issue is the initial server response time. Basically, it’s taking a long time for the server to deliver the HTML page.

In debugging the issue, I’ve found that this embedding method works well when there are only a few Bokeh components, but it scales poorly as the number of Bokeh components increases, getting very slow once there are a few hundred components (and in my application, there are indeed a few hundred components).

I illustrate this issue here: https://github.com/EfremBraun/bokeh-scaling-demo. I took the Movies example from https://github.com/bokeh/bokeh/tree/branch-3.0/examples/app/movies and made some changes. original-0 was taken directly from the example, with 0 new widgets added, original-100 added 100 additional Slider widgets, and original-200 added 200 additional Slider widgets. embed-0 is the original example, but using embedding/Bootstrap for the display; embed-100 took that and added 100 additional Slider widgets, and embed-200 added 200 additional Slider widgets.

When I run bokeh serve original-0, open the application in a Chrome Incognito tab, and run the Lighthouse Audit, I get a 65 performance score. bokeh serve original-100 gets a 64, and bokeh serve original-200 also gets a 64. However, while bokeh serve embed-0 gets a 62 performance score (already lower than the original page, though not so bad), bokeh serve embed-100 gets a 58, and bokeh serve embed-200 gets a 54, and the page load time is noticeably slower. Screenshots showing these details can be seen below.

Screen Shot 2021-09-30 at 4 32 07 PM

Screen Shot 2021-09-30 at 4 32 09 PM

Screen Shot 2021-09-30 at 4 32 11 PM

Screen Shot 2021-09-30 at 4 32 12 PM

Screen Shot 2021-09-30 at 4 32 13 PM

Screen Shot 2021-09-30 at 4 32 27 PM

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions