Populating the TreeView seems slow (3 levels, 706 leafs)

[Richard]

I have a 3-level 706 leaf data source that is sent from my server.  
7 nodes at level-1, 121 nodes at level-2, 706 nodes at level-3.

The DOM element to contain the kendoTreeView is created dynamically as thus:

$('<div/>')

.attr('id','product-hier-levels-tree')

.appendTo('#product-hier-levels')

.kendoTreeView({

    height:'100%',

    dragAndDrop: false,

    dataSource: data.tree.data,

    select: onSelectHierNode

});

It takes about 20 seconds for the above statement to execute.  I'm pretty sure I need to load the tree in it's entirety because after it is loaded the nodes that were selected in a previous session are automatically reselected.  (onSelectHierNode does some magic to allow multiple selections in the TreeView).

Regardless, the 20s is a UI killer and hard to sell to the user.

From earlier discussions it sounds like 128 (7+121) data sources are created internally as kendoTreeView consumes my input dataSource "data.tree.data" and may be the largest cause of the delays observed.

Q: Can you recommend techniques for speeding up the tree population ?
Not sure how loadOnDemand would work if I need to auto select one or more level-3 nodes

Q: Is there a progress callback available during populating so that I can at least show something is going on ?
I would much rather have a progress bar than an indeterminate spinny.

Q: Are there any roadmap plans for a kendoVirtualTreeView ? 
I can manage the data and states myself fine, just 'call me' when you want some.

[Alex Gyoshev]

Hello RIchard,

You can use loadOnDemand:true and load only the nodes that need to be selected. This will greatly improve the performance, at the cost that you need to keep the path to the pre-selected nodes (i.e. if the pre-selected node is in the first child of the second rood node, you should open them after initializing the tree)

Greetings,
Alex Gyoshev
the Telerik team