Ajax to make browser Load

Question

Allo,

EDIT:

1- OPEN FIREBUG, on the console tab

2- OPEN YOUR GMAIL ACCOUNT,

3- when gmail is loaded, click on one of your label (at the left under the draft box)

4- WITH FIREBUG YOU SEE THAT THE PAGE DOES NOT COMLETLY RELAOD SINCE ALL PREVIOUS ACTION STILL THERE FOR THE CURRENT DOCUMENT, BUT THE BROWSER COMPLETLY ACT LIKE THE PAGE HAVE BEEN RELOADED, stop button browser own loading effect, etc...)

5- !!!!! this is it..!!!!

Does some on have a clue on how site like Gmail can make the browser load on ajax call ( I mean show the loading icon and all, history, etc)

I already know what to check for the hisroty navigation but how in the world they can make the browser to act like this was a simple link that load a complete new page.

facebook seems to do similar thing

from what I see with things like firebug Gmail basicly reteive mail information in JSON and than use some javacript to render it to the user. But how they make the browser load in the while.

EDIT:

In gmail once it is loaded, abviously they ain't load all the data, from all your folder in background, so when you click on some of your folder and the data is not already loaded they make the browser 'load' like if it were loading a complete new page, while they retreive the information from their server with some ajax call ( in Firefox you see the browser act like when you click on a normal link, loading icon, stop (x) button activated, and all). Is it clear,? I dont think Wikipedia will be much help

EDIT:

Any idea, someone! I came up with some 'ugly' code to achieve my goal that work quite nice in FireFox and IE (sadly it seems to not work in Chrome/WebKit and Opera(who use Opera ;-) ). I tell the browser to go to a url that it will not be able to reach before the ajax call end, with window.location=. The browser start to load and than when the ajax call sucess I call window.stop() (window.document.execCommand('Stop') for IE) than innerHTML the ajax data in the document To me its look ugly and since it not work properly in Chrome/Webkit, this is apperantly not the way to go. Any idea, someone!

EDIT: Someone!!??

Answer 1

There are many ways to utilize AJAX.

Gmail needs to load a lot of files/data before something meaningful can be displayed for the users.

E.g. showing the folder tree first doesn't make sense if it's not clickable or not ready for any interactive use.

Hence, what they do is show something lightweight like a loading graphic/progress bar while asynchronously (behind the scene), pull more data from the server until they can populate the page with a full interface for usage.

I don't know how to explain further. Maybe wiki can help: http://en.wikipedia.org/wiki/Ajax%5F%28programming%29

Answer 2

Sitepoint has a book "Build Your Own AJAX Applications" and they show some content (all?) in this tutorial: http://articles.sitepoint.com/article/build-your-own-ajax-web-apps

They will guide you with your AJAX coding.

Answer 3

http://www.stevesouders.com/blog/2009/04/27/loading-scripts-without-blocking/

Use one of the methods shown as triggering a browser busy state in the table on the page above.

Answer 4

Think this is your answer:

http://www.obviously.com/tech_tips/slow_load_technique

Looks like gmail and facebook method (browser is showing page as "loading" with loading icons etc. - it is just simulating, because there is a background ajax request) :)