[ALOY-1689] Optimize model "change" and "remove" data-binding with ListView/TableView
GitHub Issue | n/a |
---|---|
Type | Improvement |
Priority | Low |
Status | Open |
Resolution | Unresolved |
Affected Version/s | n/a |
Fix Version/s | n/a |
Components | Models |
Labels | ListView, TableView, change, data-binding, events, optimization, remove |
Reporter | Joshua Quick |
Assignee | Joshua Quick |
Created | 2019-05-24T02:06:22.000+0000 |
Updated | 2019-05-24T02:44:47.000+0000 |
Description
*Summary:*
When data-binding a model to a
ListView
or TableView
, the model's "change" and "remove" events cause all of the rows to be removed and recreated. This is very expensive if the model collection is very large. This should be optimized so that if only 1 model has been changed, then we replace its 1 row in the UI instead. And if only 1 model has been removed, then delete its 1 row from the UI.
*Recommended Solution:*
When the Alloy generated code populates an array of rows to be added to the ListView
or TableView
, it should also set up a dictionary which maps the model IDs to their respective row indexes. We can then use this dictionary for fast lookup when a "change" or "remove" event happens.
*Note:*
We cannot do the above optimization if a "dataFilter" has been assigned to the ListView
or TableView
. A "dataFilter" is a function that takes the source model array and returns a new array to be turned into rows in the UI. This "dataFilter" function is intended to be used to exclude elements (ex: a search filter) and/or sort elements. Since it's capable of sorting, we have to assume that a changed model needs to be repositioned in the UI. Unfortunately, this means preserving the old behavior where we destroy all rows and recreate them.
No comments