18

At first I thought that hash hack is a requirement, however judging from the recent updates from facebook, I am thinking otherwise.

The original hash hack (I am not sure if this is the correct term) is that by changing location.hash, one may save a state in the URL without refreshing the page. That is extensively used by Google's apps, and Facebook, and lately #NewTwitter. However today I noticed that Facebook no longer have this "#" if you use a "modern" browser - like chrome or firefox. I double checked that they are not reloading by using developer tools and firebug respectively.

With a minimal search in stackoverflow, the closest one to the solution is using Flash - however I disabled Flash and facebook.com still works like a charm. Judging from the coverage in chrome 8 dev and firefox 4 beta, I wonder that could be related to HTML5-era APIs, but the code in Facebook is not of my capacity to debug to find out what they did.

Since this is like the first question I ask here, I wonder if any of you may have already solved this problem.

Thanks guys.

P.S. Doesn't work on IE8, haven't tested on IE9 beta.

2
  • What "Doesn't work on IE8"? :) This is covered by Google's AJAX crawling guidelines. They have a showcase at gwt.google.com/samples/Showcase/Showcase.html which may be useful here.
    – bzlm
    Commented Oct 22, 2010 at 13:32
  • 1
    I don't know if this is the answer, but there is client-side data storage in HTML5. Perhaps that is utilized. In Safari (and I assume Chrome) there's a "Storage" section of the developer tools. Perhaps that will give some hints.
    – user113716
    Commented Oct 22, 2010 at 14:06

1 Answer 1

21

Facebook is using the history api in HTML5. From this blog post you can see how this works. Basically they are making calls like the one below to change the url without reloading the page.

window.history.pushState("object or string", "Title", "/new-url");

Here is the HTML5 working draft spec about it: http://www.whatwg.org/specs/web-apps/current-work/multipage/history.html#the-location-interface

Sadly, IE9 does not support this api. New versions of Chrome and FF have full support.

3
  • Thanks for answering and I think I need to dig deeper in the dev specs. -> dev.w3.org/html5/spec/history.html Commented Oct 25, 2010 at 6:24
  • 2
    I just found this jquery plugin you may want to check out. It seems pretty good for handling this, plus it degrades to handle browsers that don't support HTML5. asual.com/jquery/address Commented Oct 25, 2010 at 14:16
  • 1
    What about ie9. How to do it in ie9 Commented Jun 25, 2012 at 10:21

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.