<cfsilence>

Real Life Ajax Scroll Paging

Posted At : October 25, 2007 8:36 AM | Posted By : todd sharp
Related Categories: cfsnippets, ColdFusion, Ajax

You're all probably tired of hearing me blab about this, but the real reason why I decided to revisit my Ajax scroll pagination demo yesterday was because I needed to use this technique on CFSnippets.org. Here is a real life application. Scroll down the list of snippets and once you get to the 10th snippet the next batch will load.

This is also the first real world application of cfajaxproxy that I've used. It might not stay like that (I may switch to using Spry.Utils.loadURL) but it's certainly a kick ass tag and was very simple to use.

The loading/paging process is a bit slow right now because of my newness to ColdSpring/Model-Glue. My next step is to work on speeding that up.

Oh - and the reason I needed to add pagination to the snippet view page will also be coming soon...

Comments (9) |

Print |

Send |

del.icio.us |

Linking Blogs | 2956 Views

Comments

[Add Comment]

This isn't directly related, but the link that you gave @ CFSnippets.org is dreadfully heavy. I looked at the source and I noticed that many of the JavaScripts that are needed are referenced twice, causing the page to be over 300-kb. Is this an issue with CF8? Is everyone of those linked JS files needed to run those CF8 AJAX implementations? It seems a little much to me, especially if you need to be concerned with page load times.

# Posted By Toby Dawes | 10/25/07 10:35 AM

Toby:

There is _an_ issue (you're right - not directly related) that causes that (gee thanks for noticing ;) - kidding).

What happens is when you have Ajax stuff in a custom tag or cfinclude and then have Ajax stuff inside that tag/include the scripts do get included twice.

So in my example I have a cfwindow in the layout of my entire site (for the contact form) and another cfwindow on that page (for the snippet view) so the scripts are getting duped. Thanks for the reminder - I've been meaning to ping Adobe on this. I'll do that now...

# Posted By todd sharp | 10/25/07 10:42 AM

Cool idea but, I wonder if it's practical for such a small amount of data. It seems that you should find a way to preload the next set or two of records. It would be awesome to make it look ahead "behind the scene" to cache the next couple of "pages" of records. I am just thinking out loud but, the concept is great and your ability to implement "unobtrusively" nice!

Thanks for sharing your amazing work.

# Posted By Robb | 10/25/07 11:47 AM

The reason I had to do this is because one of the libraries is about to have more then 200 snippets in it. There was no way I'd be able to load that many at a time. But maybe increasing the load to say 15-20 would be good enough for most of the libraries on there?

# Posted By todd sharp | 10/25/07 12:21 PM

Also: once I modify the remote service to used a cached version of the ColdSpring bean factory the load will be *much* quicker. Hopefull almost seemless to the user.

# Posted By todd sharp | 10/25/07 12:22 PM

I wouldn't worry about the multiple references to the same JS file. Chances are the browser will cache it and the second request will be (if done at all) inconsequential.

# Posted By Doug Hughes | 10/25/07 3:18 PM

Good point Doug. I did ping Adobe and they are going to look into it. It can tend to break things if you were to use for example a cfwindow in the custom tag and a cflayout (tabbed) in your wrapped content. I'm not sure _why_ but it does.

In my case though, nothing's broken so I'll just work on getting my CS bean factory cached and this thing will be speedy...

# Posted By todd sharp | 10/25/07 4:18 PM

@no one in particular:

Just fixed the page to use a cached version of my ColdSpring factory. Load time went from ~1500ms to around ~100ms. Paging is quick as heck now.

# Posted By todd sharp | 10/25/07 9:24 PM

give me more idea if data small

# Posted By Ajax scrolling pages | 1/28/08 8:06 AM

[Add Comment]