| Issue 116: | Expand/Collapse performance is bad when using fx and large number of child nodes | |
| 1 person starred this issue and may be notified of changes. | Back to list |
What steps will reproduce the problem?
1. Set fx option using fx: { height: "toggle", duration: 200 }
2. Have a large number of nodes - although problem seems to be directly
proportional to number of nodes.
3. Expand and Collapse the folder.
(If possible, please attach an example HTML file, that works when copied
into the dynatree/doc/ folder.)
What is the expected output? What do you see instead?
200ms Expand/Collapse of all the children. Seems like it was adding 200ms
per child node (not sure, just subjective).
What version of the product are you using? 0.5.1 Rev 279
On what operating system and browser? Vista x64, Firefox 3.5.2
Please provide any additional information below.
I rem'd out the fx: option and the problem went away.
$(function() {
$("#tree").dynatree({
debugLevel: 2,
minExpandLevel: 1,
title: "Select All",
rootVisible: true,
persist: false, //do not persist between page reloads
checkbox: true, //show checkboxes for all nodes
selectMode: 3, //perform hierarchical selection
//fx: { height: "toggle", duration: 200 },
onSelect: function(flag, dtnode) { saveTreeValues(flag, dtnode); },
initAjax: { url: $("#SiteNamePath").val() + $("#AppId").val() },
onPostInit: function(isReloading, isError) { saveTreeValues(); }
});
});
Sep 2, 2009
(No comment was entered for this change.)
Status:
Accepted
Cc: moo...@wwWendt.de
Sep 2, 2009
(No comment was entered for this change.)
Owner:
moo...@wwWendt.de
Cc: -moo...@wwWendt.de
Sep 2, 2009
(No comment was entered for this change.)
Labels:
Milestone-Release0.5.2
Sep 20, 2009
I tried to expand a root node 130 children on FF 3.5 on Vista 32. There was no noticable delay. Can you post a link to your example? (n.b. FireBug benchmark shows that 99% of the time is spent inside jquery.)
Sep 20, 2009
Currently, it's an internal only dev site, so it's hard for me to make public for you. I'll try to mock something up. What "fx" settings did you try?
Sep 20, 2009
I tried a 3-level tree, that has ~150 1st level nodes.
Than expanded/collapsed the root (minExpandLevel: 0, to make the root collapsible)
$("#tree").dynatree({
title: "Lazy loading sample",
rootVisible: true,
minExpandLevel: 0, // 1: root node is not collapsible
persist: true,
checkbox: true,
selectMode: 3,
fx: { height: "toggle", duration: 200 },
[...]
Sep 20, 2009
Mine was with 4-5 root level nodes, with a hundred or so per root level.
Sep 20, 2009
Here's a failing test case with actual JSON from my application. See schools.json for the data and testpage.html to load the example. If you turn on FX, reload the page, then start expanding and collapsing the 4 top level nodes, you'll see how the performance takes a big hit.
Sep 21, 2009
Cool, I didn't know that "url:" works with local files :-) Thanks for building this sample! Some q'n'd timings on my Athlon 5000 box: Expanding simple animated Yadkin (23 nodes) 0.05 0.12 sec Guilford (335 nodes) 0.34 3.18 sec I tracked it down to the $.animate() call, so it's inside jQuery. But the root cause is propably, that all child nodes are rendered as separate <div> tags, so we need 335 animate calls. I don't see a quick fix here, but I am planning to wrap all children into one <div> tag, when implementing drag'n'drop in the next major release, so I postpone it until then.
Labels:
-Milestone-Release0.5.2 Milestone-Release1.0
Nov 14, 2010
v1.0 should be way faster now; can you confirm?
Status:
Waiting
Nov 20, 2010
(No comment was entered for this change.)
Status:
Done
Labels: -Milestone-Release1.0
Jul 17, 2012
considered verified
Jul 17, 2012
(No comment was entered for this change.)
Status:
Verified
Jan 26, 2013
(No comment was entered for this change.)
Labels:
Milestone-Release0.0
|
84.3 KB View Download