现在用户体验变得越来越重要,对于一个网站肯定要有非常丰富的内容,那么如何更快更好的将所有栏目呈现给用户呢?我觉得异步加载技术是其中一个解决方案。
比如:用户浏览一个页面时,要下载的内容是html的代码,js的代码,css的代码,图片,Flash。而这些只能线性的下载,也就是说,这些内容如果加起来有500kb,那么用户就要顺序下载这500kb的内容,当然,IE或FireFox有自己的读取方式,仔细观察会发现,他们会预先呈现一部分内容,但仍然是线性的方式,只是读一部分呈现一部分而已。如何更快的将内容呈现给用户,减少用户的等待感。
首先界面先按布局的方式划分区域,比如
<div id=“menu”></div>
<div id=“title”></div>
<div id=“context”></div>
<div id=“copyright”></div>
那么用户进入界面时,读取的html只有以上大小而已,而具体的内容我们通过xmlhttp来进行异步加载,JS伪码如下:
<script>
async('menu/index.htm','menu');
async('title/index.htm','menu');
async('context/index.htm','menu');
async('copyright/index.htm','menu');
</script>
每一个界面都是以异步的方式同时读取,这样等于同时读取多个栏目的内容,会使用户拥有更好的用户体验。
具体的封装以及读取方法,我在进行整理。
网站的例子:http://www.plaxo.com 等等