This is my personal blog. The views expressed on these pages are mine alone and not those of my employer.

Tuesday, September 20, 2005

AJAX History Libraries

I know of the the following AJAX libraries and techniques which address bookmarking and the back button in AJAX applications: Backbase, Dojo, Mike Stenhouse's "Fixing the Back Button and Enabling Bookmarking for AJAX Apps" article, Erik Arvidsson's Hash Listener library, and the Really Simple History framework I created recently. I will be fully describing the Really Simply History library in a forth-comming article from the O'Reilly Network.

The following major issues affect all of the AJAX history libraries I have evaluated, other than the Really Simple History framework.

First, some history frameworks, such as Dojo, use JavaScript objects to store an internal representation of the state of an AJAX application's history; unfortunately, browsers completely clear out all JavaScript objects when a user leaves a page. If a user interacts with an AJAX application, navigates to Google, and then returns to their original AJAX page, the AJAX history framework's internal state is erased and becomes confused.

Another bug that affects many frameworks is that they do not differentiate between the first time a page truly loads versus "fake" page loads. In many browsers, when a user first loads an AJAX application, the browser will throw an onload event. Later, if the user navigates to a different web site and then returns using the back button, the browser will throw a new onload event even though the page already loaded the first time. Many subtle bugs can occur in AJAX history frameworks unless these two kinds of load events are differentiated.

Finally, I have not seen an AJAX history framework that will detect when a user has manually entered a new hash location in Internet Explorer.

The Really Simple History framework, available here, uses several techniques to solve these bugs. The primary mechanism is achieved using DhtmlHistory, a JavaScript class that allows developers to store history state after the browser has left a web page. This data is persisted between page loads using the auto save capability of web forms; see my blog post "AJAX Tutorial: Saving Session Across Page Loads Without Cookies, On The Client Side" for implementation details. DhtmlHistory wraps the auto save trick with an easy hash table API for developers, and the main RSH framework then uses the DhtmlHistory class to implement stateless tracking of history; variables that allow the detection of fake versus real page load events; and more.

Comments:
I gave your download a 5 minute spin and couldn't get it to work. It seems like all I should need to do is call dhtmlHistory.initialize(); when my page first loads. Do I need to call dhtmlHistory.add("uniqueId", "doesntmatter") whenever I execute a DHTML request?
 
Brad Neuberg wrote an article on how to use this framework on onJava.com -
AJAX: How to Handle Bookmarks and Back Buttons
 
Your isValidKey was returning false for keys containing dashes. I added the dash \- to the regex on line 542 and it's working for me.
 
Matt, you must make sure that you are working from a local web server when you are using RSH (you should do this in your DHTML work in general, since browsers behave quite differently for file:// URLs versus http:// ones).

You also need to call dhtmlHistory.add to register history events, or else they won't be registered.

Uncle Stinky, thanks for finding that.
 
Is this file downloadable from elsewhere. I've tried a couple of times over the past month or so on several PC's and the Zip file seems to be corupt.

Cheers
Aaryn
 
I have tried downloading the "latest.zip" several times and it appears to be corrupt. I managed to get a copy of dhtmlhistory.js from another source and had the "line 512" problem as well. After fixing that I am still unable to get it to store the history in IE 6.
 
I find some problem with asp.net.
when i use the library, if working in page(.html),it works ok.
but if working in page(.aspx),itís wrong.
when i refresh the page(.aspx),it can't back incorrectly.
 
Hi Brad,

I have tried using RSH on my website but without luck can you give me step by step instruction in setting up the same.
 
Greetings,

Brad, a very good approach, I enjoy seeing how other forward thinkers continue to develop solutions. I have also created a solution that involves a new HTML Microformat and doesn't require
polling, two features I thought were particularly appealing. If
you're interested in a method for handling the infamous back/forward
buttons in Ajax applications the full article can be read here.

http://positionabsolute.net/blog/2007/07/javascript-history-service.php

Cheers,
Matt
 
It appears no one has ever actually gotten this thing to work. Does anyone have a working example online to see before I waste anymore time on this?
 
@Ed: RSH works; the comments are of various forms, from "Can you help me with your homework?" basically, where someone wants me to do the hard work for them so I don't respond, to people having issues with the download link (it turns out many corporate firewalls and proxies corrupt the ZIP file, so they have a TAR file they can download). RSH currently has issues with IE 7, because I haven't been able to maintain the library for the last year, but has been used for many years by many sites to reliably help with history. If you search online you will find an easy patch that makes RSH work with IE 7.

Brad
 
Post a Comment



Links to this post:

Create a Link



<< Home

This page is powered by Blogger. Isn't yours?

Subscribe to Posts [Atom]