I’ve observed a performance issue with the TreeGrid. It performs an AJAX call for each expanded item in the tree.
The tree has one root parent, 100 children and 5 grandchildren per child. Of the 100 children, half are expanded.
Upon running the code, the expanded/unexpanded arrow status is rendered correctly from the beginning, but initially all the children are shown collapsed. Further, for each child there is an AJAX call retrieving its grandchildren. This will yield 50 additional AJAX calls, in a slow (about 1-2 seconds) succession.
It would be great if Expanded/Unexpanded status is handled on server, which delivers a chunk of the table to be rendered. Is there an option to do this? Also, since my tree is relatively small, it there any setting to disable virtual paging and simply transfer the whole data model, including the expansion status, in the initialization request?
Not reproducible here, if the tree content is changed by another callback, the refresh ends with the exception from TreeData:
throw new IllegalArgumentException("Item '" + item + "' not in the hierarchy");
The code:
package com.razvan;
import com.vaadin.flow.component.grid.Grid;
import com.vaadin.flow.component.orderedlayout.VerticalLayout;
import com.vaadin.flow.component.treegrid.TreeGrid;
import com.vaadin.flow.data.provider.hierarchy.TreeData;
import com.vaadin.flow.data.provider.hierarchy.TreeDataProvider;
import com.vaadin.flow.router.Route;
import java.util.Random;
@Route(value="tree")
public class TestTreeGrid extends VerticalLayout {
static public class DataItem { // for data sake, two columns
private String label;
private Integer count;
DataItem() {
label = surname[rand.nextInt(surname.length)]
+ " " + name[rand.nextInt(name.length)]
;
count = rand.nextInt(500000);
}
public String getLabel() {
return label;
}
public Integer getCount() {
return count;
}
public void setCount(Integer count) {
this.count = count;
}
private static String[] surname = new String[]
{"Alice","Bob","Carol","David","Emma","Fiona","George","Hans"};
private static String[] name = new String[]
{"Alistair","Bergson","Colin","Davidson","Erwin","Ford","Grady","Heisenberg"};
private static Random rand = new Random();
}
TreeData<DataItem> data =new TreeData<>();
TreeGrid<DataItem> tree = new TreeGrid<>();
TreeDataProvider dataProvider = new TreeDataProvider<>(data);
public TestTreeGrid() {
getStyle().set("height","100%");
tree.getStyle().set("height","100%");
add(tree);
tree.addHierarchyColumn(x->x.getLabel()).setHeader("Name");
tree.addColumn(x->x.getCount()).setHeader("Count");
tree.setDataProvider(dataProvider);
tree.setSelectionMode(Grid.SelectionMode.MULTI);
DataItem root = new DataItem();
data.addRootItems(root);
root.setCount(1);
for (int i = 0; i != 200; i++) {
DataItem di = new DataItem();
di.setCount(7);
data.addItem(root,di);
for (int k = 0; k != 5; k++)
data.addItem(di, new DataItem());
if (i%2 == 0)
tree.expand(di);
}
tree.expand(root); // only works if placed after we added items
// dataProvider.refreshAll(); // no effect
}
}