|
| |
User Groups : Forums : SiteExperts : Dynamic HTML
:  |  Tree + Lazy Loading + Endless Scrolling
Has anybody ever seen such an AJAXed tree with BOTH "Lazy Loading" and "Endless Scrolling"? Any pointers to where you've seen it?
Or at least, pull me out if you think I'm heading into a wrong direction. Thanks. Here's the situation.
I may have a tree, having multiple roots, each of which may be N-level deep, with each branch possibly having N number of nodes and/or sub-branches. At the same level, branches show first, nodes show last. (How big? Well, mid-scale. Number of records may range from hundreds to tens of thousands)
I could implement "Lazy Loading" whenever a branch is opened, like most lazy loading trees do. Yet, this branch may contain several tens of thousands of branches and/or tree nodes. This explains why I needed endless scrolling as well.
You can imagine that this problem gets complicated when "Endless Scrolling" joins in. The key to basic endless scrolling is to always keep track of which last record is shown. For the tree's case, however, I at least need to keep track of one extra thing, i.e. whether I am endlessly scrolling branches or nodes.
But still, "Endless Scrolling" has to support nodes located at any level deep.
The presentation also gets complicated. Here's to visualize.
Root 1
-- branch 1
-- N number of nodes
...
... (endless scrolling happening)
...
-- branch 2
-- branch 3
Root 1 is opened, all sub-branches 1, 2, 3 are loaded. You can imagine the problem after opening branch 1 with thousands of items in it: In theory I can't scroll down to branch 2 until I've loaded (or triggered) everything within branch 1. IMHO, not a good experience for the user either.
I could perhaps detect how many "rows" there are under branch 1 when it gets opened, and first create the height needed. Maybe that's one way.
I also welcome ideas of design alternatives, but the primary constraints are, no JavaScript frameworks used, it has to be in one tree, and these information has to go into the tree, I can't have a tree only containing branches where the nodes are loaded into a separate view.Started By Terry Young on Jul 24, 2009 at 1:21:07 AM | | | 5 Response(s) | Reply |
| View All Replies | | | Terry Young on Jul 29, 2009 at 9:00:14 PM Well, I've made a decision.
I now feel that "endleess scrolling" is more suitable for a flat structure, similar to Google Reader or bing.com's image search.
I've decided that "endless scrolling" and a "tree structure" is too sophisticated to maintain, and I may not be the only person who would maintain the code in the future. I also believe this is one of the main reasons why we can't seem to find such a thing on the web. The only one close enough which I could find, was the dhtmlxTree. Do a search if anyone's interested.
So I will just KISS the code (Keep It Simple, Stupid)
branch
- node 1
- ....
- node 500
- [ more... ]
Pretty much bod1467's idea. So, thank you, bod1467.
If you click "more", than it's replaced by an AJAX-looking loading icon, and replaced again at the moment the next 500 records returns (appended with a new [more] button with new parameters if even more records are still detected).
I'm not sure about sub-branches, so I'll load ALL sub-branches per tree-level anyway. Whoever organizes their tree in such a way where there are zillion folders in the same level (my tree can be modified by the user) would most probably be an idiot anyway. So the "more button" would only be for the tree leaves.
| | View All Replies |
To respond to a discussion, you must first logon.
If you are not registered, please register yourself to become a member of the SiteExperts.community.
|
