Downloading all the content behind the scene like gmail

I am exploring the possibility to develop a web app that can download most of the data necessary behind the scene and at the initiation to increase user experience.

  1. How exactly does gmail implement this features? I know it uses lots ajax, and you can see it working by Firebug->net

    But I still not very clear.

  2. How to use Yii framework to achieve to implement the similar effect?

Thank you!

  • Nick

create controllers with actions, do ajax queries to them, retrive the data, process it, etc.

Yii has some nice jQuery stuff, but it is php framework not javascript framework…

So you need to digg dipper inside the javascript

Yii wont do all the ajax stuff for you… but actually it does a lot with the ajaxLink etc.

Here’s how I usually do this, mind you this is purely the JavaScript side of it:


[*] On document ready, execute a function that searches the DOM for internal links (e.g. all links that don’t start with http://)

[*] For each of these links, create a new DIV whose ID is the link href target and whose content is the linked page’s content. You probably only want to load a part of the linked page, for example the main div (#content or whatever).

[*] Bind a function to these links, that executes when they are clicked. Instead of following the link, this function swaps the content of the main container (#content) with the content of the container whose ID matches the href of the link we just clicked.


Be aware that this example is simplified and probably doesn’t work out very good if you have lots of dynamic content. I mainly used it for static pages.

Gmail uses GWT framework, where you write code in Java and GWT convert it to javascript code. Take a look if you want to develop gmail like app -

Otherwise you can also try to use Yii with some javascript framework like Sammy (

Thank you very much, guys!

I feel a little dizzy with so much more information. but I love it~