Description
openedon Sep 18, 2018
Dash would greatly benefit from inbuilt support for debounce. Currently user interaction can easily run into multiple updates or race conditions.
For a simple repro, take the datatable example in https://github.com/plotly/dash-table-experiments/blob/master/usage.py, stick some time.sleeps & logging in update handlers, spin it up and select multiple rows in the grid. You should easily see multiple updates in logs. It's tricky in this example to get a race where an earlier user selection comes in last overriding a later selection, however I have seen this happen in my app.
Debounce is a standard feature in popular javascript util libraries - most js apps feature either lodash or rxjs in their dependencies.
ShinyR also has it: https://shiny.rstudio.com/reference/shiny/latest/debounce.html, and debouncing in some form has been a standard UI practice/feature at least since the days of WPF/Silverlight
There has been some suggestion of modifying/patching datatable to add debounce, however this would require modifying every component and ideally this should be an inbuilt feature of dash core components - eg. if we could wrap a whole component, app or section with a dcc.Debounce() component, then that section would debounce all updates from child components ( debouncing from the clientside, within react)
These could be useful without bringing in lodash or rxjs:
https://www.npmjs.com/package/react-debounce-input
Debounce function using Ramda.js:
https://gist.github.com/tommmyy/daf61103d6022cd23d74c71b0e8adc0d
https://www.npmjs.com/package/debounce