1. Home
  2. Forum
  3. Angular - EJ 2
  4. Performance of Dropdown Tree

Performance of Dropdown Tree

The performance of the Dropdown Tree when autoCheck is selected it very poor.

I have created an example where there are over 2000 items in the Dropdown Tree with 5 levels of nesting. When checking one of the root nodes it takes between 3-10 seconds for the item to be selected.

See https://stackblitz.com/edit/angular-cj5z89?file=app.component.ts


15 Replies 1 reply marked as answer
SM Shalini Maragathavel Syncfusion Team July 20, 2021 02:30 PM UTC

Hi Jeremy, 

Greetings from Syncfusion support. 
                                                                                                                                         
We have validated your query and would like to let you know that, performance issue in Dropdown Tree while selecting the large data has been resolved in our latest package version(v19.2.0.48). To overcome the reported performance issue, we suggest you to update the package to the version 19.2.0.48.

We have modified your sample based on this for reference in the below link. 

Regards, 
Shalini M. 


JC Jeremy Carter July 20, 2021 10:23 PM UTC

Shalini,


Thank you very much. I will test against the latest version.


JC Jeremy Carter July 20, 2021 10:28 PM UTC

Was this performance issue already known and fixed prior to me submitting a forum post?


KR Keerthana Rajendran Syncfusion Team July 21, 2021 05:53 AM UTC

Hi Jeremy,  
 
Most welcome.  
 
Yes, the performance issue was an already known issue and it has been fixed in the latest package version (19.2.0.48). Please test with the latest version and get back to us if you need further assistance. 
 
Regards, 
Keerthana R. 


JC Jeremy Carter July 22, 2021 05:22 AM UTC

Still having performance issues with the Dropdown Tree.

When the component is destroyed it can take up to 10 seconds for browser to respond again, it jams right up.

This is because the underlying TreeView is being "unchecked" for each item when the Dropdown Tree is destroyed.

Demo:  Angular (forked) (stackblitz.com)

In the demo I have setup the dropdown to be destroyed after an item is selected. You can then see the timing of the destroy method as:


Started destroy 2021-07-22T05:21:27.844Z

Finished destroy 2021-07-22T05:21:36.201Z 

This is 9 seconds to destroy!





See the EJ2 source code:

controls/navigations/src/treeview/treeview.ts

and

controls/dropdowns/src/drop-down-tree/drop-down-tree.ts


SM Shalini Maragathavel Syncfusion Team July 23, 2021 02:27 PM UTC

Hi Jeremy,   
 
Sorry for the inconvenience.
 

We checked the sample and able to replicate the mentioned scenario. Currently, we are validating your query at our end. So, we will update further details within two business days on July 27th 2021. 

Until then, we appreciate your patience. 


Regards,   
Shalini M.

 


JC Jeremy Carter July 25, 2021 10:38 PM UTC

My temporary workaround is before destroying the parent component to run this code:

ngOnDestroy() {
  // Temporary fix to speed up the destroy of the dropdown
  ;(this.dropdown as any).treeObj.showCheckBox = false
  this.dropdown.destroy()
}

This tells the underlying TreeView not to show CheckBoxes and thus to not "uncheck" each item on destroy.




KR Keerthana Rajendran Syncfusion Team July 26, 2021 04:53 PM UTC

Hi Jeremy, 

Thanks for the update. 

We are validating the reported scenario with priority and we will update you further details on July 27th, 2021 as promised earlier. 

Please make use of your temporary workaround till then.  

Regards, 
Keerthana. 


SM Shalini Maragathavel Syncfusion Team July 27, 2021 01:09 PM UTC

Hi Jeremy, 
  
Thanks for the patience.  
  
We have validated the reported issue with Dropdown Tree component and considered the reported scenario “Improve the performance of Dropdown Tree component while destroying with huge data source and checkbox” as a bug from our end. The fix for this issue will be included in our Volume 2 SP release which is expected to be rolled out by the mid of August, 2021.    
    
You can track the status of your reported problem through the below portal link. 
  
   
Until then we appreciate your patience.  
  
Regards, 
Shalini M. 


SM Shalini Maragathavel Syncfusion Team August 12, 2021 12:01 PM UTC

Hi Jeremy,
 
  
We are glad to announce that our Essential Studio 2021 Volume 2 service pack release v19.2.0.55 is rolled out and is available for download under the following link. 
  
  
In this release, we have improved “the performance of Dropdown Tree component while destroying with huge data source and checkbox”. To access this fix, we suggest you to update the package to the latest version (v19.2.55).  
  
  
Please, refer to the below sample link. 
  
  
We thank you for your support and appreciate your patience in waiting for this release. Please get in touch with us if you would require any further assistance. 
Regards, 
Shalini M 
  
  


Marked as answer
SS Sriram Satyavolu February 10, 2023 01:20 PM UTC

When I use Select/All unselect all in the dropdown tree, with filtering, the browser hangs for up to 30 secs.


SS Sriram Satyavolu February 14, 2023 11:32 AM UTC

Anything on this please ? When I try to use the unselect all checkbox in a dropdrown tree, the browser seems to hang for about 20-30 seconds. I have a tree of about 30 - 40 nodes with sub trees.


IL Indhumathy Loganathan Syncfusion Team February 14, 2023 02:00 PM UTC

Hi Sriram,


We have improved the performance related issues while performing Select All/Unselect All operations on the Dropdown Tree component in 20.4.49 version. Check out the below release notes.


https://ej2.syncfusion.com/angular/documentation/release-notes/20.4.49/?type=all#dropdown-tree


So we suggest you to once update the packages to latest version. For your reference, we have attached a sample.


https://stackblitz.com/edit/angular-cm4bgk?file=src%2Fapp%2Fapp.module.ts,src%2Fapp%2Fapp.component.ts


Check out the shared sample and get back to us if you need any further assistance.


Regards,

Indhumathy L


SS Sriram Satyavolu February 14, 2023 02:52 PM UTC

We need autoCheck with filtering .. I believe DropdownTree is not allowing this currently .. when will this be addressed ? 


IL Indhumathy Loganathan Syncfusion Team February 16, 2023 01:34 PM UTC

Sriram, We have already considered this requirement as a feature request on our end. But we do not have any immediate plans to implement this feature. At the planning stage for every release cycle, we review all open features. Usually, Syncfusion will plan and implement the features based on feature rank, customer requested count, and volume wish-list. We will let you know when this feature is implemented.


The status of implementation can be tracked through the below portal link:

https://www.syncfusion.com/feedback/19874/support-for-autocheck-functionality-when-enabling-the-filtering-in-dropdowntree


Loader.
Up arrow icon