中国第一Ajax站长门户:www.okajax.com   虚拟主机 域名注册 云主机

20个Ajax关键议题 - okajax.com - Ajax中国

我要投稿 会员登陆 RSS订阅 本站推荐:
您的位置主页 > Ajax技术 > Ajax问题解答 > 20个Ajax关键议题

20个Ajax关键议题

2009-05-03    文章来源:互联网    浏览次数:

历经多年的发展,Web仍停留在点选、换页的浏览方式。 Ajax出现后,改写了此种网页必须不断重新载入的互动模式,运用非同步技术,网页只更新局部的内容,因此提供使用者更顺畅、即时的互动模式。

少了「重新载入」的动作,Ajax呈现的是比传统更酷炫效果,但是否该全面采用Ajax,企业除了看热闹外,更想了解「门道」。 Ajax会不会拖慢效能?主要的学习门槛是什么?搜寻引擎会不会因此找不到网页内容,而影响了网站曝光度?其他RIA(Rich Internet Application)技术是否会取而代之?更重要的是,会不会引发资安的问题?

让我们一网打尽所有关于Ajax的问题,帮助你打通任督二脉,快速了解Ajax美丽与哀愁。

概念
 

Q1:采用Ajax技术,除了酷炫效果之外,还有什么好处?
答:所谓的「酷炫」应该是指可以随意拖放网页上的Widget、色彩渐层、元件的淡出/淡入、图案变大/变小等效果,或者惊艳于Web Mail竟然可以提供类似Outlook的介面。

其实最直接而明显的好处,是减少网页重新载入的次数。

根据统计,购物网站每刷新一次网页,就会有10%的消费者在等待的过程中「清醒」,发觉未必有购买的需要,而取消交易。当网页不再因为少部分的资料被修改,就必须重新载入整个网页,即可减少使用者等待的时间,提供更流畅的操控体验。

无论是酷炫效果、精致的画面,或者顺畅的流程,对于网站的形象、商品销售及使用者体验都具加分的效果。

Q2:操控流畅对网站是有加分效果,但从企业的角度,关心的层面还包括Intranet的应用,Web应用程式适合加入Ajax技术吗?
答:在我们了解推推王、UrMap、Yahoo!及网擎Mail2000等的Ajax应用之后,发现Web应用程式还真的非常适合采用Ajax技术。

注意力持续,有效提升生产力
应用程式的操作往往包含复杂的流程,然而Web化之后,流程变成了一连串网页提交(Submit)的动作,每一次的更新网页都需要数秒的等待,而且不能按「上一页」退回前一个步骤。

在Web化的时代,企业最担心的问题,并不是浪费了那几秒等待载入网页的时间,而是人在等待的空闲,很自然地会开启另一个网页,注意力就被导引到其他更有趣的资讯上,再次回神时,可能是半小时以后。

所以,对购物网站而言,注意力的持续是订单的保证;对企业而言,则是生产力的提升。

延续桌面应用程式的操控体验
不能按「上一页」的操作模式,强烈地显现出「应用程式」与「浏览器」操作习性上的不同。当应用程式执行的环境搬到Web之后,使用者仍然期待保有桌面应用的操作体验,透过Ajax的非同步技术,即有机会消弭应用程式与浏览器之间的鸿沟。

以Yahoo!邮件信箱与Mail 2000为例,在Ajax化之后,使用者体验的是与Outlook极其类似的操作方式。网擎资讯从用户的回馈发现,由于操控方式的改变,使直觉与便利性向前跃进一大步,因此使用者满意度明显提升。

Q3:会不会拖慢Web伺服器效能?
答:可能是因为Ajax的酷炫效果,以及首次载入Ajax网页的时间比一般HTML网页长的原因,所以容易让人误以为采用Ajax会拖慢伺服器效能。事实上,刚好相反!

Ajax技术与传统网页与Web伺服器沟通方式各有不同。传统的作法是用户端送一个请求(Request)至Web伺服器,即使只需更动一个栏位的值,Web伺服器仍需重组一个完整的网页,回应(Response)给用户端,也因此浏览器必须重新载入一次。

相较之下Ajax技术使网页具备程式能力,当使用者修改资料,触发了JavaScript程式,浏览器便将使用者输入的资料传送至Web伺服器,Web伺服器会再把需要回传的资料送至浏览器,当JavaScript接收到资料之后,再把结果呈现在网页上。

过程中完全没有触发提交动作,Web伺服器只回传需要修改的内容,而且浏览器也没有重新载入的动作。这对伺服器负载、频宽使用量及用户端的操作体验是三赢的局面。

根据UrMap改用Ajax技术传递地图资讯的经验,在使用人数成长了10倍以上的情况下,伺服器的负担相较于以往仍是减少,而频宽使用量也没有增加太多。

再以网擎资讯Mail 2000 4.5 Beta版改采Ajax技术为例,观察的结果发现,伺服器需要运算的资料量减少,频宽成本也下降。以一页的信件列表为例,过去100封邮件约需要传送120KB的资料量,现在则降为30KB。点选「新信检查」功能,递送的资料量约略是过去的1/5~1/4。

Q4:AutoComplete这类的Ajax机制,频繁地向伺服器要资料,应该会拖慢效能,是否有方法可解?
答:AutoComplete或内容自动更新等Ajax机制,是使用者非常喜欢的功能。但人数众多时,确实可能拖慢伺服器效能。

不过,此类问题可从设计上解决,例如设定快取机制、延长反应的时间、每填入3个英文字母才查询一次,或者限制使用资料等,都是可能的解法。

带领开发UrMap的友迈科技董事长卓政宏形容:「这是一种程式管理资源的方法。」他举例:UrMap下载的地图资讯,其实略多于网页显示的范围,使用者微幅地拖拉或缩放地图时,其实叫用的是本机资料,并没有对伺服器发出请求。所以,只要根据使用者的行为模式调整设计,就可以降低伺服器的负担。

Q5:那么Ajax对用户端的执行效能有何影响?
答:相对于传统网页,Ajax技术使得用户端与伺服器传递的资料量变少,又避免了网页重新载入的机会,Ajax操作阶段的效能的确是较佳的。

不过,首次登入网站时,下载的资料除了页面呈现的内容外,还包含强化互动性的JavaScript程式时,你可能会发现载入时间变长。针对用户端的执行效能,Yahoo!国际资讯软体工程师蒋定宇认为:「尽量缩短JavaScript程式码,就可以将影响降到最低。」
 

Q6:企业如果要导入Ajax,人才好不好找?
答:Ajax包括JavaScript、DHTML、CSS、XMLHttpRequest、XML或JSON等,是众多技术的集合,要了解这些技术,一定存在着门槛。

其实Ajax主要是JavaScript的应用,但蒋定宇从面试JavaScript工程师的经验发现:「台湾比较重视ASP、Java和PHP。」过去JavaScript是设计警告讯息或文数字检查等辅助网页输入的稿本语言,所以开发者普遍认为JavaScript、HTML、CSS只是网页设计的辅助语言,所以好的JavaScript人才难寻。

网擎资讯研发经理张嘉渊提出类似观点:「技术都不是问题,JavaScript不难,但要写得好,不容易。开发者必须用写『核心』的心态开发JavaScript。」

Q7:那么对于懂JavaScript的程式开发人员而言,Ajax的门槛在哪里?
从开发者的立场来看,推推王创办人邱继弘倒认为:「CSS和DOM是主要的门槛。」

Ajax技术超出单纯程式开发的范围,开发者需要与设计人员合作,并了解网页相关的CSS、DHTML、DOM等技术。即便成熟的工具相对降低学习的难度,但要学的东西变多了,同样形成一种门槛。

Q8:这么看来,网页开发团队的角色定位与合作方式,是否因为导入Ajax而必须改变?
答:工作方式确实会受到冲击。以Yahoo!为例,过去网页设计分为VD(Visual Designer,视觉设计师)与RD(Research Developer,研发人员)两种角色。 VD负责网页设计,必须了解HTML应用,RD则熟PHP、API、资料库等技术,让网页串连后端程式与资料。

而今在VD与RD之间,多了一个WD(Web Developer,网页开发人员),举凡「检视原始码」可看到的内容,包括HTML、CSS、JavaScript都是WD负责的范围。

工作方式将产生明显的变化,VD描绘出网页应该有的样子,WD则思考HTML标签的语义,使用正确的标签做出正确的网页结构,再搭配CSS给予外观样式。此外,最重要的工作就是运用JavaScript撰写网页的前端互动行为。

网页设计流程到WD为止,仍是非真实的页面,尚未连接后端真实的连结与资料。当网页交给RD之后,RD人员负责套上真实的连结与资料。

这样的开发流程并非台湾Yahoo!特有的设计,在美国Yahoo! ,他们称WD为Front-end Engineer;而蕃薯藤称为Web Master;趋势科技则称之为Prototyper。

工作形态的转变是必然的趋势。当前端网页的设计,除了美工之外,还包含程式化机制,人员角色与开发流程都会随之变化。即使在有限人力的情况下,必须一人分饰两角(通常是RD再身兼WD的工作),但设计(Designer)与开发(Developer)两者的合作模式,仍不同于以往。

Q9:网页包含CSS、HTML,还有JavaScript程式,是否会不好维护?
答:根据Yahoo!的定义,网页包括上述三种元素,HTML定义结构、CSS设计样式,而JavaScript控制行为。导入Ajax将迫使网页采用CSS,如此模组化的切分方式,反而是提高网页的维护性。

不过,虽然维护Ajax网页并不困难,但相较于其他程式语言,即使JavaScript的开发工具已经逐渐成熟,除错(Debug)方面的功能仍有瓶颈。主要是因为各种浏览器针对使用者的操作,所触发的各种事件仍有差异,除非浏览器走向标准化,否则开发工具要模拟各种浏览器的行为仍有难度。

不过还是有一些选择。就像IE浏览器已经推出Internet Explorer Developer Toolbar,或者可以选择IE Inspector推出的AxScripter等,而Firefox则提供Firefox Debugger。透过这些外挂套件的协助,已经逐渐降低除错的难度。

Q10:既有的网站或Web应用程式,是否建议以Ajax技术改写吗?
答:若是新兴的网站或Web应用程式,尤其是产品化的Web应用程式或网站,采用Ajax技术几乎可说是不得不的选择,而且如果没有提供Ajax的效果,相形之下很容易失去竞争力。

然而,对既有的网站而言,「为技术而技术」是非理性的行为。卓政宏认为:「技术的进步总是会有帮助,但必须考量是否有投资的价值?企业应该思考Ajax能做什么?」

邱继弘建议:「针对特定问题,运用Ajax解决技术上的瓶颈就好。」许多功能往往是牵一发而动全身,稍加更动就必须全部改写,全盘翻新的风险太高。

Ajax原本就是众多技术的集合。对于初学者而言,Ajax的门槛不低。即使只是微幅的修改,在测试与上线的过程中,仍有许多琐碎的工作要面对,所以冒然采用未必是明智的决定。

Q11:Ajax技术会不会有跨平台的限制?
答:若是问Ajax能否跨作业系统平台,答案是Yes。

Q12:Ajax技术跨浏览器的问题该如何解决?
答:Ajax在跨浏览器遭遇的问题,在于浏览器之间的行为差异,所以开发者需要测试JavaScript程式在各种浏览器执行时的相容性,并针对差异的部分,撰写不同版本的程式。

或者,最简单的方式,就是套用YUI等Framework,透过平台解决相容性问题。

Q13:Ajax开发的应用能否平顺地在电脑、手机、PDA等不同装置上顺畅运行?
答:答案是No。随想行动科技总经理冯彦文表示:「主要原因在于手机装置对规格的支援不一,不论J2ME、Flash或Ajax都会遇到相同的问题。」

再者,每款手机的萤幕大小都不同,况且一般网页的资料量灌入手机萤幕会显得冗长。若要讲求美观,都必须针对行动装置提供特殊化的内容。例如国外知名的微型部落格网站Twitter,便针对手机平台设计特制的网站m.twitter.com。

Q14:听说用Ajax开发的网页内容,搜寻引擎可能找不到,那不就会影响网站的能见度?
答:其实是设计上的问题。这关乎一个专有名词称为SEO(Search Engine Optimization,搜寻引擎最佳化)。关于SEO的顾虑,究其原理,搜寻引擎的机器人是根据网页中的连结找到其他的网页,再找到内容,所以网页内容必须使用固定网址(Permalinks),搜寻引擎才会找得到。

若是改由JavaScript动态产生内容,那么将变成是由事件驱动(Event Driven),也就是使用者「开启」网页或「点选」连结才会产出内容,那么搜寻引擎机器人便无法找到资料。

邱继弘说:「这是网站设计的一种思维。希望增加曝光度,就要能够被搜寻引擎找到。」推推王中关于Ajax技术多半都用在视觉上,每笔资料都有独立的网址,他们绝对不破坏「Content Unique」的原则。

Q15:什么样的应用不适合采用Ajax?
答:以下几种情况不建议使用Ajax技术:

网页需要变动的范围比例很高
张嘉渊强调:「取决的关键点,就在于要搬多少资料到浏览器。」Ajax适合应用在局部、小量资料的修改,以减少网页重新载入的机会,网页中需要更新的比例很高,不如就重新载入吧!

排序
在ASP、JSP盛行之后,在网页上利用DataGrid控制项建置动态查询的报表是企业常见的应用。除了简单的查询功能,还可以任意地点选栏位变换排序的方式。此种应用便不适合采用Ajax。

尤其是在资料笔数多的情况下,张嘉渊强调:「20笔和100笔资料的排序,对网页效能的影响,绝对不只是5倍的差距。」对浏览器而言,变更排序方式就是整个DOM(Document Object Model,文件物件模型)的摧毁与重制,这类的应用反而是交给擅长资料处理的资料库比较适合。

需要换页的应用
Ajax诉求的就是实现不换页的资料更新,所以网址列没有变动,而这也就没有「上一页」、「下一页」的记录。因此有换页需求,尤其使用者有可能按「上一页」的应用,便不适合采用Ajax。

Web应用程式之所以适合采用Ajax技术的原因,也在于应用程式没有换页的概念。因此,在开发Ajax应用时,设计者也应在操作思维上,避开使用者会想按「上一页」的可能性。

Q16:若讲究高互动性,其他RIA技术例如微软的Silverlight及Adobe的Flash,可以提供更即时互动的效果,为什么选择Ajax? Ajax会不会只是过渡性的技术?
答:这个问题必须分成以下两个层面来回答:

Silverlight或Flash的门槛更高
习惯右脑思考的程式开发者,未必能兼擅需要以左脑设计的Flash或Silverlight。当我们询问推推王的开发团队这个问题时,相关人等全部摇头晃脑地表示不喜欢Flash。其中陈冠杰以过去尝试使用Flash经验表示:「Flash的效能比较差,程式化的行为必须写在ActionScript中。」

从微软展示的Silverlight案例中,德国的女性购物网站OTTO、法国的法雅客购物网站,它们的图像化、直觉式的流畅设计确实令人目炫神迷。

假如是没有专业美工人才的网站,他们更难以面对Dreamweaver或Expression Blend,要接受以时间线(Timeline)结合图层产生动感效果的概念,开发人员需跨过的门槛更高。

Flash、Silverlight与Ajax可以并用
就微软开发平台而言,企业若需要比Ajax更酷炫的视觉效果,可利用Expression Studio设计网页、图像及动画等视觉元素,而逻辑运算的部分,则仍然是透过Visual Studio工具开发Ajax应用,所以两者并不冲突。

而Flash的应用,程式化采用的稿本语言是ActionScript,它的语法非常类似JavaScript,但仍可能令开发者感到排斥。 Adobe现已提出解决的方案,为了强化Flash与Ajax的互动,Adobe推出Flex-Ajax Bridge,让JavaScript与ActionScript可以相互沟通,那么Ajax与Flash元件就可以并存。

  • 第1页:Ajax基础概念16问
  • 第2页:Ajax安全性四问
  • 上一篇:AJAX跨域访问出现'没有权限'的错误
  • 下一篇:没有了
  • 文章评论(查看全部)

    看不清楚?单击换一张。
    loading.. 评论加载中....
    关于我们 - 广告服务 - 版权隐私 - 免责声明 - RSS地图 - 网站地图 - 使用帮助 - 返回顶部