硕士论文-富客户端技术的应用及性能分析.pdf

南开大学 硕士学位论文 富客户端技术的应用及性能分析 姓名 彭科峰 申请学位级别 硕士 专业 计算机应用技术 指导教师 程仁洪 20090501 摘要 摘要 随着W e b 应用的日益广泛和W e b 开发技术的不断发展 以用户体验型网络 服务为特征的W e b 应用代表了目前互联网的发展趋势 在W e b 应用系统架构的 几次转变中 富客户端模型被提出 富客户端模型的出现 提供了一种新的w e b 设计方法 通过对富客户端模式的应用 不仅改变了传统w e b 应用模式 同时 也开拓了一片W e b 开发的新领域 本文即对富客户端模式下的W e b 开发进行研究 重点研究如何将A J A X 技 术与传统的W e b 开发相结合并有效地应用在企业级W e b 应用开发过程中 以及 A J A X 应用性能问题 论文工作分为三部分进行 首先本文从W e b 技术发展的起源谈起 分析 A J A X 能够为传统的W e b 应用带来些什么 它的优势在什么地方 然后解释A J A X 的基本组成技术和核心原理 展示了最小的A J A X 框架应 该拥有的组成部分和A J A X 数据交互的基础方法 通过比较A J A X 的流行框架 作者选择E x t 框架作为实现本文应用的主要框架 接着在了解A J A X 基本原理 与A J A X 框架的基础知识的前提下通过具体的应用展示了A J A X 的实现技术 并对应用中出现的问题进行了分析 并给出了解决方法 最后对A J A X 应用的性能问题进行了研究与分析 对不同的 A X 框架的 性能 以及如何对W e b 前端应用进行性能分析给出了方法 并且对网站使用 A J A x 技术后在性能方面的提升得出了量化的结果 关键词 富客户端技术A J A XE x t 性能分析 A b s t r a c t A b s t r a c t W i t ht h ep o p u l a r i z a t i o no fw e ba p p l i c a t i o na n dt h ec o n t i n u o u sd e v e l o p m e n to f w e bt e c h n o l o g y W e b b a s e dn e t w o r ks e r v i c e sc h a r a c t e r i z e db yu s e re x p e r i e n c es t a n d f o rc u r r e n tt r e n do ft h eI n t e r n e td e v e l o p m e n t D u r i n gs e v e r a lc h a n g e si nt h es t r u c t u r e o fw e ba p p l i c a t i o n s an e wi n t e r a c t i v ew e ba p p l i c a t i o nm o d e li sp r o p o s e d R i c h C l i e n tm o d e l m c hC l i e n tm o d e lp r o v i d e san e wk i n dw e bd e s i g np a t t e r n 鼬c hc l i e n t m o d e lh a sn o to n l yc h a n g e dt h et r a d i t i o n a lw e ba p p l i c a t i o np a t t e r n i ta l s oo p e n su pa n e wp i e c eo fw e bd e v e l o p m e n tf i e l d T h i sa r t i ci st os t u d yA J A X b a s e dw e ba p p l i c a t i o nd e v e l o p m e n t S t u d yh o wt o c o m b i n eA J A Xw i t ht r a d i t i o n a lw e bd e v e l o p m e n ti ne n t e r p r i s e l e v e lw e ba p p l i c a t i o n a n dt h ep e r f o r m a n c ep r o b l e mi nt h eA J A X F i r s t l y i nt h i st h e s i sw es t a r tf r o mt h eo r i g i n a t i o no fw e bt e c h n o l o g y a n n l y z e w h a tA J A Xc o u l db r i n gf o rt r a d i t i o n a lw e ba p p l i c a t i o na n dt h em a g i cp o w e ri th a s T h e nW ee x p l a i nt h em o s ti m p o r t a n tc o m p o n e n t sa n dt h ec o r ep r i n c i p l e so f A J a x i l l u s t r a t eb a s i cA J A Xf r a m e w o r ka n db a s i co fA J A Xd a t ac o m m u n i c a t i o n C o m p a r i n gt h em o s tp o p u l a rA J A Xf r a m e w o r k E x ti su s e dt oi m p l e m e n ta l lt h e e x a m p l e sm e n t i o n e dt nt h et h e s i s W ea l s oa n a l y s et h ep r o b l e mf o u n di nt h er e a l p r o j e c t a n dg i v ea r e s o l u t i o n F i n a l yw ea n a l y s et h ep e r f o r m a c ep r o b l e m i nt h eA J A Xa p p l i c a t i o n W e c o m p a r et h ep e r f o r m a n c eb e t w e e nd i f f e r e n tA J A Xf r a m e w o r k s f i n daw a y t oa n a l y s e t h ef r o n to fW e b b a s e da p p l i c a t i o n a n dm e a s u r et h ep e r f o r m a n c eg a i n e dw h e nu s i n g t h eA J A Xt e c h n i c K e yW o r d s 黜c hC l i e n t m a x E x t P e r f o r m a n c ea n a l y z i n g I I 南开大学学位论文电子版授权使用协议 请将此协议书装订于论文首页 论文 系本人在 南开大学工作和学习期间创作完成的作品 并已通过论文答辩 本人系本作品的唯一作者 第一作者 即著作权人 现本人同意将本作品收 录于 南开大学博硕士学位论文全文数据库 本人承诺 已提交的学位论文电子 版与印刷版论文的内容一致 如因不同而引起学术声誉上的损失由本人自负 本人完全了解g 直珏太堂图量焦苤王堡查 焦旦堂鱼途塞的笪理查洼 同意 南开大学图书馆在下述范围内免费使用本人作品的电子版 本作品呈交当年 在校园网上提供论文目录检索 文摘浏览以及论文全文部分 浏览服务 论文前1 6 页 公开级学位论文全文电子版于提交1 年后 在校园网上允 许读者浏览并下载全文 注 本协议书对于 非公开学位论文 在保密期限过后同样适用 院系所名称 作者签名 学号 日期 年 月日 南开大学学位论文原创性声明 本人郑重声明 所呈交的学位论文 是本人在导师指导下 进行 研究工作所取得的成果 除文中已经注明引用的内容外 本学位论文 的研究成果不包含任何他人创作的 己公开发表或者没有公开发表的 作品的内容 对本论文所涉及的研究工作做出贡献的其他个人和集 体 均已在文中以明确方式标明 本学位论文原创性声明的法律责任 由本人承担 学位论文作者签名 I V 嘲 嘲峰 年6 月罗 日 第一章研究背景和发展现状 第一章研究背景和发展现状 第一节引言 C S 架构应用程序 是在二十世纪九十年代出现的 它采用图形用户界面 客户端的数据处理能力比较强 具有强大的数据操作和事物处理能力 但是 随着应用程序的复杂程度不断提高 该架构逐渐出现了部署成本高 客户端应 用程序更新困难等问题 由于该架构的种种弊端 九十年代中期 互联网飞速发展 出现了B S 结 构浏览器 服务器应用程序 浏览器的广泛使用解决了应用程序部署和更新的困 难 但是 应用程序受制于浏览器的限制 无法像C S 结构那样使用丰富的效 果来展示数据 用户体验相对平凡 随着应用程序复杂性越来越高 传统的应 用程序已经渐渐不能满足浏览者更高的 全方位的体验要求了 这个问题被 M a c r o m e d i a 公司称之为 体验问题 E x p e r i e n c eM a R c O 此时一种被称为 富 客户端 R i c hc l i e l l t 的思想开始出到1 1 富客户端实际上也是一种基于B S 的架构但是又有一些C S 架构的特征 它可以让用户拥有更高的交互性和更佳的用户体验 用户不需要安装任何客户 端软件 使用浏览器或者安装极少量的插件就能够完成所需要的工作 A J A X 是W 曲2 O 的核心之一 2 A J A X 是A s y n c h r o n o u sJ a v a S c r i p ta n dX M L 的缩写 它并不是一门新的语言或技术 它实际上是几项技术按一定的方式组 合在一起 在共同的协作中发挥各自的作用 它主要包括以下五个方面 1 使用X M L H t t p R e q u e s t 对象进行异步数据读取 2 使用X H T M L 和C S S 标准化呈现 3 使用H T M L D O M 实现动态显示和交互 4 使用X M L 和X S L T 进行数据交换与处理 5 使用J a v a S c r i p t 绑定和处理所有数据 A J A X 相当于在用户和服务器之间加了一个中间层 使用户操作与服务器响 应异步化 通过把以前的一些服务器负担的工作转嫁到客户端 充分利于客户 端闲置的处理能力完成一些工作 减轻服务器和带宽的负担 从而达到节约服 第一章研究背景和发展现状 务器处理器资源及带宽租用成本的目的 第二节W e b 技术的发展 从上个世纪9 0 年代起I n t e r n e t 经历过翻天覆地的重大变革 从最早的使用 基于文本的简单浏览器进行信息发布 到如今 I n t e m e t 已经成为贸易和信息的 中心 并成为大量应用的首选平台 W e b 应用的技术也随之发生了很大的变化 从技术层面看 W e b 架构的精华有四处 用超文本技术 H T M L 实现信息与信息的 连接 用统一资源定位技术0 d R I 实现全球信息的精确定位 用新的应用层协议 H T T P 实现分布式的信息共享 用X M L 实现无差别的跨平台 跨应用的数据传 输 这四个特点无一不与信息的分发 获取和利用有关 其实 T i mB e m e r s L e e 早就明确无误地指出 W e b 是一个抽象的 假想的 信息空间 作为I n t e r n e t 上 的一种应用架构 W e b 的首要任务就是向人们提供信息和信息服纠3 1 最初 所有W e b 页面都是静态的 用户请求一个资源 服务再返回这个资 源 在浏览器发展的最初阶段 W e b 页面的这种静态性是可以满足用户的需求 的 但是随着W e b 应用的不断扩大 个人计算机的普及和W i n d o w s 操作平台的 问世 用户希望能得到更动态的网上体验 评价一种W 曲开发技术优劣的标准 只有一个 那就是看这种技术能否在最恰当的时间和地点 以最恰当的方式 为最需要信息的人们提供最恰当的信息服务 W e b 是一种典型的分布式应用架构 W e b 应用中的每一次信息交换都要涉 及到客户端和服务器端两个层面 因此 W e b 开发技术大体上也可以被分为客 户端技术和服务器端技术两大类 1 2 1 服务器端技术的发展 与客户端技术从静态向动态的演进过程类似 W e b 服务器端的开发技术也 是由静态向动态逐渐发展 完善起来的 最早的W e b 服务器简单地响应浏览器发来的H T T P 请求 并将存储在服务 器上的H T M L 文件返回给浏览器 一种名为5 5 1 S e r v e rS i d eI n c l u d e s 的技术可 以让W e b 服务器在返回H T M L 文件前 更新H T M L 文件的某些内容 但其功能 非常有限 第一种真正使服务器能根据运行时的具体情况 动态生成H T M L 页 2 第一章研究背景和发展现状 面的技术是大名鼎鼎的C G I C o m m o nG a t e w a yI n t e r f a c e 技术 1 9 9 3 年 C G I1 0 的标准草案由N C S A N a t i o n a lC e n t e rf o rS u p e r c o m p u t i n gA p p l i e a t i o n s 提出 19 9 5 年 N C S A 开始制定C G I1 1 标准 1 9 9 7 年 C G l l 2 也被纳入了议事日程 C G I 技术允许服务器端的应用程序根据客户端的请求 动态生成H T M L 页面 这使 客户端和服务器端的动态信息交换成为了可能 随着C G I 技术的普及 聊天室 论坛 电子商务 信息查询 全文检索等各式各样的W e b 应用蓬勃兴起 人们 终于可以享受到信息检索 信息交换 信息处理等更为便捷的信息服务 1 9 9 4 年 R a s m u sL e r d o r f 发明了专用于W 曲服务器端编程的P H P P e r s o n a l H o m e P a g eT o o l s 语言 与以往的C G I 程序不同 P H P 语言将H T M L 代码和P H P 指令合成为完整的服务端动态页面 W e b 应用的开发者可以用一种更加简便 快捷的方式实现动态W e b 功能 时至今日 P H P 依然是最流行的W e b 开发语言 之一 1 9 9 6 年 M i c r o s o t I 借鉴P H P 的思想 在其W e b 服务器I I S 3 0 中引入了A S P 技术 A S P 使用的脚本语言是熟悉的V B S 嘶p t 和J a v a S e r i p t 借助M i c r o s o f t V i s u a l S t u d i o 等开发工具在市场上的成功 A S P 迅速成为了W i n d o w s 系统下W e b 服务器端的主流开发技术 1 9 9 7 年 S e r v l e t 技术问世 1 9 9 8 年 J S P 技术诞生 S e r v l e t 和J S P 的组合f 还 可以加上J a v a B e a n 技术 让J a v a 开发者同时拥有了类似C G I 程序的业务处理功 能和类似P H P 的H T M L 嵌入功能 此外 J V M 技术的发展与优化也大大提高了 S e r v l e t 和J S P 的执行效率一这也正是S e r v l e t 和J S P 被后来的J 2 E E 平台吸纳为 核心技术的原因之一 J 2 E E 是纯粹基于J a v a 的解决方案 4 1 9 9 8 年 S u n 发布了E J B l 0 标准 E J B 为企业级应用中必不可少的数据封装 事务处理 交易控制等功能提供了良 好的技术基础 至此 J 2 E E 平台的三大核心技术S e r v i a J S P 和E J B 都己先后 问世 2 0 0 2 年 M i c r o s o f t 正式发布 N E TF r a m e w o r k 和V i s u a lS t u d i o N E T 开发 环境 早在 N E T 发布之前 就已经有许多W i n d o w 平台的W e b 开发者迫不及待 地利用B e t a 版本开发W e b 应用了 因为 N E T 平台及相关的开发环境不但为W e b 服务端应用提供了一个支持多种语言的 通用的运行平台 而且还引入了 A S P N E T 这样一种全新的W e b 开发技术 A S P N E T 超越了A S P 的局限 可以使 用V B N E T C f 等编译型语言 支持W e bF o r m N E TS e r v e rC o n t r o l A D O N E T 等高级特性 客观地讲 N E T 平台 尤其是 N E T 平台中的A S E N E T 的确不失 3 第一章研究背景和发展现状 为认W e b 开发技术在W i n d o w s 平台上的一个集大成者 1 2 2 客户端技术的发展 W e b 客户端的主要任务是展现信息内容 而H T M L 语言则是信息展现的最 有效载体之一 作为一种实用的超文本语言 H T M L 的历史最早可以追溯到上 世纪四十年代 1 H T M L 的出现 1 9 4 5 年 V a n n e r v a rB u s h 在一篇文章中阐述了文本和文本之间通过超级链接 相互关联的思想 并在文中给出了一种能实现信息关联的设计方案 1 9 6 0 年前后 D o u gE n g e l b a r t 等人则 对信息关联技术做了最早的实验 与 此同时 T e dN e l s o n 正式将这种信息关联技术命名为超文本 H y P e r t e x t 技术 1 9 6 9 年 I B M 的C h a r l e s G o l d f a r b 发明了可用于描述超文本信息的 G M L G e n e r a l i z e dM a r k u pL a n g u a g e 语言 1 9 7 8 到1 9 8 6 年间 在A N S I 等组织的努力下 G M L 语言进一步发展成为 著名的S G M L 语言标准 1 9 8 9 年 当T i mB e m e r s L e e W e b 应用创始人 和他的同事们试图创建一个 基于超文本的分布式应用系统时 T i mB e m e r s L e e 意识到 S G M L 是描述超文 本信息的一个上佳方案 但美中不足的是 S G M L 过于复杂 不利于信息的传 递和解析 于是 T i m B e m e r s L e e 对S G M L 语言做了大刀阔斧的简化和完善 1 9 9 0 年 第一个图形化的W e b 浏览器 W o r dW i d eW e b 终于可以使用一 种为W e b 度身定制的语言 H T M L 来展现超文本信息了 2 N e t s c a p e 浏览器1 0 发布以及后期的浏览器大战 1 9 9 4 年 M a r e A n d r e e s s e n 新发布的N e t s c a p e 浏览器大受当时上网一族的欢 迎 因为N e t s c a p e l 0 浏览器创造了一个记录 它比上一代的M o s a i c 浏览速度足 足快了十倍 还独创性地使用密钥算法保证网上数据的安全 于是乎 N e t s c a p e 浏览器立刻占领了高达7 0 的市场 人人几乎都是用它上网 而微软适时地抓 住了这一波的互联网热潮 成功地取得M o s a i c 软件的许可 可以研发基于M o s a i c 的各种不同的浏览器 至此 N e t s c a p e 与微软之间长达数年之久的浏览器大战开 始了 无疑 这场大战 有力的推动了W e b 客户端技术的发展 3 浏览器对J a v a J a v a S c r i p t 的支持 4 第一章研究背景和发展现状 19 9 6 年 N e t s c a p e 浏览器在其2 0 版中增加了对J a v a A p p l e t s 和J a v a S c r i p t 的支持 N e t s c a p e 的冤家对头 M i c r o s o f t 的I E 3 0 也在这 年开始支持J a v a 技 术 现在 喜欢动画 喜欢交互操作 喜欢客户端应用的开发人员可以用J a v a 或J a v a S c r i p t 语言随心所欲地丰富H T M L 页面的功能了 4 C S S 及D H T M L 的诞生 真正让H T M L 页面又酷又炫 动感无限的是C S S C a s c a d i n gS t y l eS h e e t s 和 D H T M L D y n a m i cH T M L 技术 1 9 9 7 年的N e t s c a p e4 0 不但支持C S S 而且增加了许多N e t s c a p e 公司自定 义的动态H T M L 标记 这些标记在C S S 的基础上 让H T M L 页面中的各种要素 动 了起来 M i e r o s o t t 发布了I E 4 0 并将动态H T M L 标记 C S S 和动态对 象模型 D H q W I Lo b j e c tM o d e l 发展成了一套完整 实用 高效的客户端开发技术 体系 M i c r o s o f t 称其为D H T M L 同样是实现H T M L 页面的动态效果 D H T M L 技术无需启动J a v a 虚拟机或其他脚本环境 可以在浏览器的支持下 获得更好 的展现效果和更高的执行效率 时至今日D H T M L 和C S S 技术基本上是客户端 编程不可或缺的一部分了 5 F l a s h 开始普及 19 9 0 年初期 J o n a t h a nG a y 在F u t u r e W a v e 公司开发了一种名为F u t u r e S p l a s hA n i m a t o r 的二维矢量动画展示工具 1 9 9 6 年 M a c r o m e d i a 公司收购了 F u f u r e W a v e 并将J o n a t h a n G a y 的发明改名为F l a s h 从此 F l a s h 动画成了W e b 开发者表现自我 展示个性的最佳方式 6 W e b2 0 与A J A X 的风暴 2 0 0 3 年之后 W e b2 0 成为了互联网的热门概念 一般来说W e b 2 0 是相对 W e b1 0 的新的一类互联网应用的统称 W e b1 0 的主要特点在于用户通过浏览 器获取信息 W e b 2 0 则更注重用户的交互作用 用户既是网站内容的消费者 浏 览者 也是网站内容的制造者 它不是一种单纯的技术 可以说是众多技术概 念的集合体 是一种内容组织传播方式 更多的体现出来的是一种表现形式 基于上述理论 目前应用包括 博客 B l o g 即时通讯 I M 社会网络 S N S 站点摘要 R S S 百科全书 W I K I 对等联I 网 P 2 P 等 A J A X 是W E B 2 O 的核心 A J A X 是已经存在了若干年的技术 却在这两年成为最新时尚 它的兴起不仅仅 是由于G o o g l e 等公司的大力引导 更是因为它能够带来更好的用户体验 改变 了人们对传统W e b 应用的不佳印剩5 1 5 第一章研究背景和发展现状 第三节富客户端与A J A X 富客户端 R i c hC l i e n t 是一个相对的概念 主要是针对时下广泛的基于 W E B 的应用 因为这种客户端 也即现有的各种浏览器 的运行环境没有提供 一个很好的组件模型和交互模型致使这种应用的界面的同服务之间的交互变的 很奇怪 每一次交互都需要重新组织出整个界面 而这个界面的组织基本在服 务器端完成 也所以致使表现层的逻辑居于服务器端 所以称这种为T h i nC l i e n t 而相对的则是R i c hC l i e n t 目前来说在技术上砌c hC l i e n t 还没有一个甚或是两个 大一统而且又成熟的标准技术出来 所以鼬c hC l i e n t 只能说是一种架构方式 其特点便是服务同表现完全的物理分离 表现逻辑完全由客户端来负责 这是 最关键的一点 一定要同时兼顾原有W E B 应用的零部署等特点 目前富客户端 应用方向主要有两种 R I A R i c hI n t e m e tA p p l i c a t i o n 与A J A X 1 3 1R I A 基本特点 R I A 是硒c hI n t e m e tA p p l i c a t i o n 富互联网应用系统 的简称 早在A J A X 广 泛推广之前 人们就试图建立一个用户接口 它比用H T M L 能实现的接口更加 健壮 反应更加灵敏和更具有令人感兴趣的可视化特性 允许在因特网上以一 种像使用W e b 一样简单的方式来部署富客户端程序 无论将来R I A 是否能够如 何程度的代替H T M L 应用系统 对于那些采用胖客户端技术运行复杂应用系统 的机构来说 R I A 确实提供了一种廉价的选择 R I A 可扩展性更大 人性化更多 视觉和互动上更好 但缺点是访问速度慢 下载文件大 并且有很多不同的厂商和联盟在以不同的思路实现R I A 技术 6 X U L X U L 念作 z o o l 是一个基于X M L 的用户界面语言 它来自于 M o z i l l a 的开放源码项目 它可用于建立窗体应用程序 这些应用程序不但可以 在M o z i l l a 浏览器上运行 而且也可以运行在其他描述引擎上 M a c r o m e d i aF l a s h 和F l e x F l a s h 是一个已经成熟的商业产品 它可以在 W e b 网页中引入交互式的图形界面 最近经过升级后 新版本包含了建立窗体 风格的应用程序的功能 尽管F l a s h 作为一个在W e b 上最广泛部署的前端技术还 有争议 取决于所选用的F l a s h P l a y e r 版本 但据称己经有9 4 以上的桌面系统 都支持F a l s h 由于用来创建动画式图形的F l a s h 工具其功能十分强大并且是可 视化的 与之相反其它技术要求进行低级的图形编码 所以图形设计人员使用起 6 第一章研究背景和发展现状 来十分得心应手 F l e x 产品对F l a s h 增加了一个X M L 描述语言 使得可以编译 用户界面 并且能够用F l a s h P l a y e r 来随时进行描述 F l e x 使得传统的开发机构 能更好地了解和使用F l a s h O r a c l eF o r m s O r a c l eF o r m s 是用来构建以数据库为中心的互联网应用系统 的一个成熟的商品化产品 通过O r a c l e F o r m s 可以使用一个输出窗体模块文件 的可视化设计器创建窗体 为了便于在该设计工具外部进一步进行处理 模块 文件要么采用私有的F M T 格式 要么采用X M L 格式 它可以与O r a c l e 数据库 和O r a c l e 平台的其他部分 如S i n g l eS i g n O n 单一登录 和E n t e r p r i s eM a n a g e r 企 业管理器 紧密集成 对国际化的广泛支持 以及创建以数据为中心应用程序的 极高效率 可以说 R I A 在很大程度上体现了下一代互联网应用的特征 所以理所当然 地成为影响到W e b 市场份额的重要制高点 W e b 应用己经带给了传统应用极大 的压力 在这个几近于改朝换代的关头 相信没有哪个厂商会放弃这个具有深 远意义的发展机会 1 3 2A J A X 与R I A 的比较 A J A X 构建速度快 以标准规范为基础 x M LH t i pR e q u e s t 并不在W 3 C 组织 的W e b 标准中 但是它己经无可争议的成为一个事实标准 在不同的浏览器间 受到了广泛的支持 它提供与服务器异步通信的能力 从而使用户从请求 响应 的循环中解脱出来 在J 2 E E 中 开发人员过于关注服务和持久性层的开发 以至于用户界面的 可用性已经落后 在一个典型的J 2 E E 开发周期中 常常会听到这样的话 没 有可投入U I 的时间 或 不能用H T M L 实现 但是 很多A J A X W e b 站点证 明 这些理由再也站不住脚了 这些W e b 站点都表明 W e b 应用程序不必完全 依赖于从服务器重新载入页面来向用户呈现更改 简而言之 在涉及到用户界 面的响应灵敏度时 W e b 应用的基准设得更高了 A J A X 比起其它R I A 技术的主要优点是无缝与H T M L 集成 因此它可以大 量使用而不需要改变现有W e b 内容 可以把它想象成W 曲站点的调料 这样做 的风险非常小 A J A X 还是后台无关且不需要任何插件 综上所述 R I A 和A J A X 采用了不同的技术路线来解决基于W e b 的应用程 7 第一章研究背景和发展现状 序的用户体验问题 各有特点 都在自己专有的领域内发挥着重要 巨大的作 用 如果为了能够实现遵循W e b 标准并且以最小化成本 利用现有W e b 站点资 源 那么A J A X 是更好的选择 第四节网站对A J A X 的需求 A J A X 的出现为网站的优化提供了以下途径 第一 在传统的基于页面的W e b 应用中 浏览器扮演着哑终端的角色 它 对用户处于操作流程哪一阶段一无所知 这些信息全部都保存在服务器上 确 切地说 就是在用户会话上 网站它把所有的数据都保存及在了服务器端 这 样每次进行用户交互的时候 都会处理并传送回一个完整的页面 其交互情况 可以参看图1 1 在用户登陆了服务器之后 用户在会话中看到的是一系列的页 面 每次页面切换都不可避免地要到服务器上走一个来回 而每次服务器返回 的页面中 很有可能大部分内容都和上一页面的内容是完全一致的 只有一个 部分是被更新的 可以看出在传统的应用中即便是一个非常简单的任务执行都 有可能需要在服务器和客户端传输大量的数据 这些数据的传递对于局域网用 户而言增大了服务器的压力 使用了稍微多一些的服务器资源 并不会感到明 显的系统反映度下降 但是在广域网传输过程中 用户就会明显感到系统反映 迟钝 8 第一章研究背景和发展现状 国11 传统W e b 戍用的生命周期 在基于A J A X 的系统交互过程中 可巳卫向服务器发起一个异步请求来完成 这件事 模板文件 导航列表和页面布局上的其它部分已经随着初始页面发送 给了浏览器 服务器无需重发 以后每次只需要发送相关的数据就可以了 A I A X 应用可以通过多种方式来傲这件事情 例如 返回一段J a v a S e r i p t 代码 一段纯 文本或者小段X M L 文档 这些方式各自的优缺点 但无论采用哪一种都远比传 统W e b 应用方式的数据传递来得高效 在A J A x 应用中 网络的通信流量主要 是集中在加载的前期 无论如何 用户登录后都需要一次性地将一个大而复杂 的客户端交付给浏览器 但是在此之后 与服务器的通信则会有效率得多 对 于瞬态应用来说 积累起来的通信流量要比以前的基于页面的W e b 应用少报多 与此同时 平均的交互次数则有所增加 整体而言 A I A X 应用的带宽消耗要比 传统的W e b 应用低一些 I 第一章研究背景和发展现状 图I2 典型A J A X 应用生命周期 第二 A J A X 技术的背后有两个推动力 W e b 标准的成熟咖 软件可用性和交 互设计理论的成熟 在软件的可用性方面 除了一些通用的可用性和交互设计 理论之外 这方面的经典著作包括 A b o u t F a c e 2 0 中文版 面向使用的软件设 计 等 W e b 应用的可用性 W e bu s a b i l i t y 也是国外非常热门的一个研究领域 主要侧重于研究如何提高W e b 网站的可用性 可以认为A J A X 就是W e b 标准和W e b 应用的可用性理论的集大成者 它极 大地改善了W e b 应用的可用性和用户的交互体验 最终得到了用户和市场的广 泛认可 所以可以说 A J A X 就是用户和市场的选择 目前A J A X 已经成为了 W e b 应用的主流开发技术 大量的业界巨头已经采纳并且在大力推动这个技术 的发展 微软开发了自己的A J A X 框架A l t o s 主要是和服务器端微软自身的A S E N E T 框架配合工作 m M O r a c l e Y a h o o R e d H a t 等业界领先的公司启动了O p e n A J A X 项目 致力于为A J A X 开发建造先进强大的开发工具 I B M 在2 月底已经发布了O p e a A J A X 项目的A J A XT o o l k i tF r a m e A T F 10 是一个基于E c l i p s e1 D E 的A J A X 开 发工具 第一苹研究背景和发展现状 S u n 虽然行动迟缓 但是也将A J A X 技术列入了J 2 E E 的蓝图中 作为J 2 E E 技术的有益的补充 基于A J A X 与J A V A 的D W R 框架也受到很多程序员的喜爱 除了上述这些公司之外 G o o g l e 公司不可不提 因为正是它率先采用A J A X 建造出了许多非常出色的应用 才将A J A X 技术引到了聚光灯下 G o o g l e 公司建 造的A J A X 应用包括G o o g l eM a p s G m a i l G o o g l eS u g g e s t 等等 其中公认最优秀 最复杂的A J A X 应用是G o o g l eM p s 由于完全基于A J A X 技术来建造G o o g l eM a p s 的界面 它提供了远远超越其竞争对手的地图服务的交互体验 对比其他G I S 应 用平台开发商 G o o g l e 后台的地图技术并不存在巨大优势 A J A X 技术和优秀的交 互设计成为了他们压倒竞争对手的最后一根稻草 最终使得G o o g l eM a p s 脱颖而 出 获得了用户的青睐 第五节课题研究的主要内容和论文的结构 本文将研究如何利用A J A X 技术解决一些实际问题 以及如何使D O M X M L 和J a v a S c r i p t 协同工作达到既定的目标 重点是结合A J A X 和J 2 E E 技术在信息 系统中的实践 由于A J A X 技术加重了客户端的编程 以前可以在服务器编程 实现的功能 需要在客户端实现 或者一些以前不能通过服务器编程实现的功 能现在可以通过A J A X 实现了 本文研究了如何将以前需要多步操作才能完成 的工作 转移一部分到客户端完成 充分利用客户端的空闲资源 让用户操作 和系统表现更加合理 更具有亲和力 并且对A J A X 在系统的性能问题进行了 研究 第1 章介绍W e b 应用技术的发展状况 说明当前发展的由来和现状 重点 说明A J A X 在W e b 技术中的地位和作用 第2 章分析A J A X 相关的技术 这是A J A X 技术基础 主要突出A J A X 技 术的组成部分和应用条件 第3 章首先介绍了几个著名的A J A X 框架 它们都是开发成熟的A J A X 应 用的基础 研究它们是为了更好的发掘它们的优势 在系统平台中合理和适当 的地方加以应用 重点介绍了系统中使用的E x t 的框架结构 第4 章通过介绍了教育部学位与研究生教学评估工作平台这个实际项目的 操作 力图表现出A J A x 能够带来的好的用户体验 并分析 解决一些在项目 中实际遇到的问题 第一章研究背景和发展现状 第5 章阐述了A J A X 应用的性能的问题 重点关注了对D o m 节点的操作效 率以及内存泄漏等问题 并对A J A x 应用与普通应用进行了对比 进一步深化 了对A J A X 应用的理解 第6 章谈自己对A J A X 技术的一些总结和展望 1 2 第二章A J A X 技术研究 第二章A J A X 技术研究 第一节 a j A X 的重要组成技术 A J A X 的全称是 A s y n c h r o n o u sJ a v a S c r i p ta n dX M L 异步J a v a S e r i p t 和X M L 所以最为重要的技术是J a v a S c r i p t 和X M L 而与之相对应 J a v a S c r i p t 涉及了 X M L H t t p R e q u e s t 对象 H T M L 文档对象模型 H T M LD O M 层叠样式表 c s s 等技术 X M L 涉及了X P a t h X M L 样式表转换语言 X S L T J a v a S c r i p t 对象标 记 J S O N 等技术 其中X M L H t t p R e q u e s t 对象将在下节中进行详细介绍 它是异 步请求的关键 在本小节中将对其它多种主要涉及的技术分别进行介绍 2 1 1 J a v a S c r i p t J a v a S c r i p t 是一种解释性的 基于对象 I n t e r p r e t e d o b j e c t b a s e d 和事件驱动 E v e n tD r i v e n 的脚本语言 使用它的目的是与H T M L 超文本标记语言 J a v a A p p l e t 层叠样式表 X M L 一起实现在一个w 曲页面中组织多个对象 与 W e b 使用者交互 它与原有的H T M L 语言相配合实现了D H T M L 的效果 通过 X M L H t t p R e q u e s t 实现了服务器请求 通过H T M LD O M 实现了用户界面的动态 更新 它主要具有以下几个基本特点 1 J a v a S c r i p t 是一种脚本语言 它采用小程序段的方式实现编程 像其它 脚本语言一样 J a v a S c r i p t 是一种解释性语言 它提供了一个简易的开 发过程 它的基本结构形式与C C V B D e l p h i 十分类似 可以通 过一定的组织吸取面向对象的一些基本特性 它不需要先编译 而是在 程序运行过程中被逐行地解释 2 J a v a S c r i p t 是一种基于对象的语言 这意味着它能运用己经存在的对象 来完成复杂的功能 当预定对象无法满足需求的时候 可以定义自己的 对象 定义其对应的行为 3 J a v a S c r i p t 的基本语法非常简单 首先它是基于类J a v a 基本语句和控制 流之上的简单而紧凑的设计 其次它采用弱类型 并未使用严格的数据 类型 在一定程度上方便了操作和语法 但是与此同时它带来了安全方 1 3 第二章A J A X 技术研究 面的问题 4 J a v a S c r i p t 提供一定安全性 它不允许访问本地的硬盘 并不能将数据 存入到服务器上 不允许对网络文档进行修改和删除 只能通过浏览器 实现信息浏览或动态交互 从而有效地防止数据的丢失 5 J a v a S c r i p t 可以改变输入输出流 可以直接对用户输入做出响应 无须 经过W e b 服务程序 它对用户的反映响应 是采用以事件驱动的方式 进行的 所谓事件驱动 E v e n tD r i v e n 就是指在某种操作或条件所产 生的动作 比如按下鼠标 移动窗口 选择菜单等都可以视为事件 事 件发生后 会触发相应的事件处理函数的执行 也可以更新用户界面 6 J a v a S c r i p t 仅依赖于浏览器本身 与操作环境无关 只要能运行浏览器 的计算机 并浏览器支持合适版本J a v a S c r i p t 就可正确执行 从而实现 了 编写一次 到处运行 的梦想 不过 不同浏览器中的J a v a S c r i p t 实 现稍有差异 这是早期浏览器大战留下的后遗症 为了跨浏览器运行 需要在编写程序的时候尽量遵循W e b 标准 不仅如此 J a v a S c r i p t 操作X M L H t t p R e q u e s t 对象跟服务器端打交道 通过 事件响应机制获取服务器端返回的消息 操作D O M 和X M L 控制信息流 更 新用户界面 这是A J A X 的核心工作 同时需要注意的是 由于J a v a S c r i p t 是在 客户端执行的代码 它也会有普通程序的一些通病 比如内存泄漏 资源未释 放等 这样拥有B u g 的J a v a S c r i p t 程序会对浏览器的实际运行造成一定影响 2 1 2H T M L 文档对象模型 H T M LD O M H T M L 文档对象模型 H T M LD O M H T M L D o c u m e n tO b j e c tM o d e l 是用于 H T M L 和X M L 文档的A P I 它提供了一种结构化的文档表示方式 从而可以修 改它的内容以及最终的表达方式 在传统的W e b 应用中 通常使用来自服务器的新的H T M L 流来刷新整个页 面 并通过提供新的H T M L 来重新定义用户界面 而在A J A X 应用中 用户界 面的更新主要是适用D O M 来完成的 H T M LD O M 将H T M L 视为树状结构的元素 所有元素以及他们的文字和属 性可通过D O M 树来操作与访问 如图2 1 所示 树的根节点是 标签 它 代表这个文档 在它的内部的 表现代表文档的主体部分 是可见的文档 1 4 第二章A J A X 技术研究 结构的根节点 在文档主体之内 有链接 标题以及其他的标签类型 l O o c u m