Binding propogation..... What is this?

[eponymic]

Question

binding propagation for 281304 active links took 0.692 s

My application is long running and is run from Supervisor. After some period of time, I don't know exactly how long, I see this message repeatedly in the Supervisor log. The number '281304' goes up and up. Does anyone know what this is? I've tried searching the discussion board here and Google. In case it's a clue, I've also noticed the hamburger menu button responds slowly during this time (could be coincidence)

[ed2050]

I've seen that message too. Was wondering the same thing.

Haven't noticed ui slowdown, but haven't paid attention either. Will check next time.

[falkoschindler]

Hi @eponymic, let me try to explain:

It looks like your app is using binding to update UI elements automatically. NiceGUI's binding module holds a collection of bindings, which are basically pairs of source and target objects. Since one object can bind to another, which binds to a third object, a binding network emerges. And if a single value changes, it has to propagate through the network.

Now there are two types of bindings:

1. "Bindable properties" automatically detect write access and trigger the value propagation. Most NiceGUI elements use these bindable properties, like value in ui.input or text in ui.label. Basically all properties with bind() methods support this type of binding.
2. All other bindings are sometimes called "active links". If you bind a label text to some dictionary entry or an attribute of a custom data model, NiceGUI's binding module has to actively check if the value changed. This is done in a refresh_loop() which runs every 0.1 seconds. The interval can be configured via binding_refresh_interval in ui.run().

The "bindable properties" are very efficient and don't cost anything as long as the values don't change. But the "active links" need to check all bound values 10 times per second. This can get costly, especially if you bind to complex objects like lists or dictionaries.

Because it is crucial not to block the main thread for too long, we show a warning if one step of the refresh_loop() takes too long. You can configure the threshold via binding.MAX_PROPAGATION_TIME which defaults to 0.01 seconds. But often the warning is a valuable indicator for a performance or memory issue. If your CPU is busy updating bindings for almost 0.7 seconds, nothing else can happen on the main thread and the UI "hangs".

Let's look into the shear number of bindings in your case: 281,304 active links seem to be way too many. And since the number is increasing, it looks like you're generating more and more UI elements (or other objects?) that are never removed. This could be, e.g., dialogs or menus that are created in a timer but never opened. I'd recommend removing parts of your UI and watching how the binding and element count behaves:

from nicegui import binding, context, ui

ui.timer(1.0, lambda: (
    print('elements:', len(context.get_client().elements)),
    print('bindings:', len(binding.bindings)),
    print('a. links:', len(binding.active_links)),
    print('b. props:', len(binding.bindable_properties)),
))

As a side note: In case you're binding against collections, you can also use the (currently undocumented) observables module. This allows you to update UI without constantly checking for changes.

from nicegui import observables

persons = observables.ObservableList(['John', 'Jane', 'Joe'], on_change=lambda _: print('persons changed'))

[v479038280]

what about a bind to a ObservableList or ObserverbleDict ,

data=ObserverbleDict({'a':'test_text'})
ui.lable('test').bind_text_from(data,'a')

which type it belongs to?

[python-and-fiction]

@v479038280 List or Dict, depend on what you define.

[v479038280]

The items in ObservableList or ObservablesDict must have a BindableProperty ,or it will refresh every binding_refresh_interval, is't right?

[python-and-fiction]

Observable[set\dict\set] is a module which changes python's data struct to be observable ( added on_change),It will be detectable for nicegui's event_handler. The other methods are same as which in python native.

[v479038280]

Mostly,the bind is efficient only when we bind one nicegui element to another nicegui element which has the bindable_property