Layout guidelines/tips for rapidly rendering many plots

_jm · April 8, 2020, 4:52pm

Thanks.

I was able to use the following TypeScript and python to extend bokeh for my specific scenario.

I basically just commented out the super.connect_signals() call in the initial attempt at a custom Div. I presume it works b/c the Widget class did not do anything in its connect_signals() method that I could see, thus enabling me to avoid a call to super.connect_signals().

With this change, my UI is smooth and instantly responsive for a 40-ish class problem that I am interactively manipulating in a grid.

TypeScript (iso_div.ts)

import {Div, DivView} from "models/widgets/div"

export class IsoDivView extends DivView {
    connect_signals(): void {
        // ***
        // Isolate root layout from div changes
        // Ref. https://discourse.bokeh.org/t/layout-guidelines-tips-for-rapidly-rendering-many-plots/5119
        //  * comment out super.connect_signals(), this might work b/c (Widget,WidgetView) has corresponding
        //    do-nothing void method ???
        //  * comment out this.root.compute_layout() to prevent re-layout of entire page if div model changes
        // ***
        //super.connect_signals()
        this.connect(this.model.change, () => {
            this.render()
            //this.root.compute_layout(); // XXX: invalidate_layout?
        })
    }
}

export class IsoDiv extends Div {
    static init_IsoDiv(): void {
        this.prototype.default_view = IsoDivView
    }
}

Python (iso_div.py)

#!/usr/bin/env python3
# -*- coding: utf-8 -*-
"""
"""
from bokeh.models import Div

class IsoDiv(Div):
    __implementation__ = "iso_div.ts"