AJAX案例研究之详细剖析Gmail应用

ajax

现在提起AJAX,大家都立刻会想起Gmail、gogle map这几个经典的AJAX应用。Gmail的优良表现我们都看过了,那么它的实现你研究过了吗?它怎么在几个不同的浏览器上可以一致的实现xml异步调用的呢?一起来看看吧。

首先,登录gmail以后我们会先进入这个页面:

<html><head><meta
content="text/html;
charset=UTF-8" http-equiv="content-type">
<title>Gmail</title><link rel="alternate"
type="application/atom+xml"
title="Gmail Atom Feed"
href="feed/atom" /><script src="?view=page&name=browser&ver=c0d3d44c64799453">
</script></head><noscript>
<font face=arial>

这是主框架网页兼浏览器检测页。如果浏览器通过了检测(支持javascript、cookie和xml控件)则在页面上写一段框架代码。要注意到的是google在这里耍了一个小花招,那个叫做main的框架页面里面看来没有多少东西,好东东都在那个叫js的框架里面呢。

我们接着把这个js框架拉出来看看:整整1500多行的javascript代码!这个页面有240多k,几乎全都是javascript代码。其实其中大部分都是老生常谈的js代码了,不过我们可以一窥google的编码风格:尽可能压缩信息量,变量名能用一个字母的绝不用两个,函数名一概都是两个字母的,函数内的会车是没有的,缩进也是没有的。

虽然代码没有特地加密,但是如此处理一番之后也就没什么可读性了。还好系统的关键字是不能缩水的,顺着xml控件的名字我们可以揪出来跟AJAX异步加载数据相关的几个关键函数:

function vb(){var a=null;
if(r)
{
var b=fG?"Microsoft.XMLHTTP":"Msxml2.XMLHTTP";
try
{
a=new ActiveXObject(b)
}
catch(c){q(c);
alert("您需要启用活动脚本功能和activeX 控件。")
}
}
else
{
a=new XMLHttpRequest();
if(!a);
{
alert("此浏览器不支持 XMLHttpRequest。")
}
}
return a
}
//emu注释 构造XML控件并返回给调用者
function ot(a,b)
{;try{a.send(b)}catch(c){q(c);
if(c.number==-2146697208)
{
alert("请确保 Internet Explorer
的”语言”设置部分不是空白。")
}}}
//emu注释 执行发送数据操作
a:XML控件
b:要发送的数据
function Wf(a,b,c){Da(3);
b=Ld(b);Hf(a,b,c)}
//emu注释 a:XML控件 b:访问的url
c:回调函数 Da是验证参数长度的函数
//Ld是一个url转换加工的函数,
主要处理url自带的CGI参数和翻页的页数等
function Hf(a,b,c){Da(3);
a.onreadystatechange=c;
a.open("GET",b,true);ot(a,null)}
//emu注释 不发送数据直接请求资源
a:XML控件 b:访问的url c:回调函数
function nt(a,b,c,d){Da(4);
a.onreadystatechange=d;
a.open("POST",b,true);
ot(a,c)
}
//emu注释 发送数据并请求资源
a:XML控件 b:访问的url
c:要发送的数据 d:回调函数

基本上就这么多了,没有什么新鲜

的东西。发送http请求之后它又怎么处理返回的xml的呢?事实上他没有处理。他所处理的仅仅是最基本responseText,而cgi则直接生成js脚本到客户端回调(用eval运行),或者生成文本信息。这就是为什么gmail可以轻松跨域几个浏览器了。

作为最受推崇的一个AJAX应用,却几乎没有用到xml。像这样用xml控件来收发文本信息后在页面上展现的技术,基本上就是现在AJAX最流行的应用方式了,不过这样也能叫AJAX吗?我宁可就叫它AJ,最多叫AJAH。今天先到这,下回再过来分析另一个完全不同的AJAX应用吧。

时间: 2024-09-05 05:52:07

AJAX案例研究之详细剖析Gmail应用的相关文章

AJAX案例研究之Gmail

ajax 现在提起AJAX,大家都立刻会想起Gmail.gogle map这几个经典的AJAX应用.Gmail的优良表现我们都看过了,那么它的实现你研究过了吗?它怎么在几个不同的浏览器上可以一致的实现xml异步调用的呢?一起来看看吧. 首先,登录gmail以后我们会先进入这个页面: <html> <head> <meta content="text/html; charset=UTF-8" http-equiv="content-type&quo

AJAX案例研究之google suggest

ajax|google Google Suggest Google有个Google Suggest的网站.当人们在搜索文本框中输入所要查询关键词的时候,Google会自动给出一些关键词的建议.从内容上看,它实际上和百度的相关搜索一样.不过在界面上却很不同,百度的相关搜索时罗列搜索结果页面的下方. 而Google的相关搜索建议确是实时显示在输入文本框下,随着输入的不同给出的提示也不同.只显示10条,同时显示的还有这些关键词搜过结果的数目.界面的不同带来的是使用行为的不同.在百度,人们必须先查找一个

AJAX案例研究之 google reader

ajax|google google reader 是google的另一个AJAX应用,以前前一直误以为是个浏览器插件,因此没有留意.昨天在网友Jared提醒下去开通了一个才见识了一吧.匆匆crack了一下代码,因为刚刚开通上面也没有多少数据,随便晃两眼吧. 首先登录readr,把reader页面另存到本地,得到一个主文件(htm),一个脚本,和一个css样式表. 把html文件中的这行去掉:<!-- saved from url=(0041)http://www.google.com/read

《BGP设计与实现》一2.10 案例研究:BGP内存的使用评估

2.10 案例研究:BGP内存的使用评估 BGP设计与实现 本案例研究的目的是为了演示不同组件之间的相互依赖性,这些组件都使用了BGP内存,这里特别关心BGP Router进程.本案例研究也建立了一个简单的方法,即基于一定数量的前缀和路径来评估所需要的BGP内存.这里使用了实验手段,来确定BGP组件与它们的内存耗费之间的种种关系.BGP消耗的总体内存是BGP网络(前缀).BGP路径.BGP路径属性.IP NDB.IP RDB,以及IP CEF所使用的内存总和.最后将提供一份Cisco的Inter

浅谈案例研究的内容营销

中介交易 SEO诊断 淘宝客 云主机 技术大厅 案例研究:是对某一单独的例子或活动进行深入研究.它提供一种分析信息.报告结果的方法,以便对某一特殊的概念或理念产生更好的理解或洞察. 那样的标题,一开始是不是听起来像在深夜的电视节目里,反复播出的吸水抹布广告? 也许是的!但它完全正确. 大多数案例研究是一些干巴巴.令人厌烦的文章,里面塞满了统计数据和让人提不起精神的信息,乏味透顶,毫无生气.它们注重产品的特点,而不是人类使用那些产品的好处.它们往往充满了自吹自擂和专业的行话. 关键在于讲一个目标受

《解读NoSQL》——1.3 NoSQL案例研究

1.3 NoSQL案例研究 我们的经济正在发生变革,企业想要保持竞争力就必须找到吸引并留住客户的新方法.要做到这一点,就必须得到技术和相关技术人员及时有效的支持.在这个技术前沿时代,解决方案需要运用新的思考方式,即如何实现从传统的思维方式向流程化.技术化的思维方式转变. 以下的案例研究展示了如何用打破陈规的思维方式更快.更经济.更有效地解决问题.表1-2总结了NoSQL解决方案用于解决特定业务问题的5个案例研究.表中展示了问题.业务驱动因素和最终结果.当你查看后面详细案例研究部分的内容时,你会发

《VPN故障诊断与排除》一2.4 案例研究

2.4 案例研究 VPN故障诊断与排除 本节介绍的问题和解决方案没有前一节介绍的那么常见. 2.4.1 案例研究1:远程AAA 本案例研究讨论涉及远程AAA的配置可能出现的一些问题. 介绍所有的远程AAA问题时,都将使用图2.38所示的网络拓扑,其中有一个NAS(LODI_NAS1)和一台终点网关(PERRIS_HGW1),远程接入客户拨号到LODI_NAS1. 1.问题1:在AAA服务器上错误地配置了L2F隧道定义 将隧道定义和配置存储在AAA服务器上是一种管理L2F VPDN的方便方式.然而

《云计算:概念、技术与架构》一2.1 案例研究1:ATN

2.1 案例研究1:ATN ATN是一家向全球电信业提供网络设备的公司.多年来,ATN成长颇多,他们将产品种类加以扩展,进行了几次收购,包括专门生产因特网.GSM和蜂窝网络提供商使用的基础设施组件.ATN现在是一家领先的.提供范围广泛的电信基础设施供应商.近年来,市场压力剧增.ATN开始通过利用新技术,特别是能够帮助成本削减的技术,来寻找增加其竞争力和效率的方法.1.?技术基础设施与环境ATN的各种收购导致其IT情况异常复杂和异构.每轮收购后的提高内部聚合力的整合程序并没有涉及IT环境,这导致同

云存储案例研究:纳斯达克市场回放

纳斯达克市场回放程序(NASDAQ Market Replay)是纳斯达克官方推出的一个新工具,它可以回放和分析证券市场的活动.这个新工具是基于Adobe Flex和AIR平台建立的,并且利用Amazon简单存储服务(Amazon Simple Storage Service,S3)对历史市场数据进行持久化.S3和AIR的组合的部署模型很强大,并且只需要很少的内部基础设施的支持.AIR运行时是跑在客户端机器上的,因此其部署简单而健壮.利用Amazon S3可以省掉传统的中间层服务器,因为数据访问