10个你必须用到Ajax的地方

10个你必须用到Ajax的地方

作者：Alex Bosworth                  创作时间：2005-12-01

译者：[e-mail]       翻译时间：2007-03-13

原文地址：http://www.sourcelabs.com/blogs/ajb/2005/12/10_places_you_must_use_ajax.html

 

 

现在距离gmail改变了大家对使用网页应用程序的方式已经有一年多了。但是目前很多网页应用程序并没有使用充满活力的Ajax的优势来代替以前沉闷的html功能。

 

下面是当前网页应用程序应该出现的地方：

 

基于表单的交互

表单是很慢的，非常慢。尝试编辑位于del.icio.us上面的一个书签？点击编辑链接打开一个编辑书签的表单页面，然后编辑你的内容并点击提交按钮等待整个提交过程结束，最后返回上一页并向下滚动到你刚才编辑的书签那里查看内容是否已经正确更改。那AJAX呢？点击编辑链接马上开始更改标签内容，点击提交按钮开始异步传输标签编辑的内容并立即看到更改后的内容而无需重载整个页面。

 

深层树状导航

总而言之，带有深层树状导航的应用程序通常是一个噩梦。在大多数情况中简单平直的拓扑结构以及搜索/标记可以很好的工作。但是如果一个应用程序真正使用深层树状导航，使用JavaScript来管理拓扑ui(user interface用户接口)，则使用Ajax懒加载深层数据可以降低服务器的负载。举例来说，为了阅读一个只有一行的结果来加载整个一个新页面是非常耗时的。

 

实时用户对用户通讯

在一个允许用户创建实时讨论的信息公告系统中，迫使用户一次又一次的更新完页面看到答复是非常愚蠢的。回复应该是实时的，用户不应被迫总是去痴迷于刷新操作。即使是gmail这个已经对以前像hotmail/yahoo mail的收件箱刷新，刷新收件箱标记的操作有所改进，也并没有充分的使用Ajax的功能来提示有新邮件到达。

 

投票、是否选择、等级评价

如果Ajax提交过程没有一个协调的UI提示是非常糟糕的，通过使用Ajax来提交一个调查或是否选择可以减少提交过程等待的痛苦。通过减少点击的等待时间，Ajax应用程序变得越来越有交互性-如果要用40秒来提交一个投票，除非非常在意的话大多数人会选择放弃。如果只花1秒呢，非常大比例的人会乐于参加投票的。（我在Netflix versus有2008张电影投票在IMDb.com有210张电影投票）

 

过滤和复杂数据操作

应用一个过滤、按日期排序、按日期和姓名排序、打开或关闭过滤器等等。任何一种高交换型操作应该交给JavaScript来处理而不是通过向服务器来提交一系列的请求。在查找或者操作大量数据的时候带来的视图上的改变最多不会超过30秒，Ajax真的使这些操作加速了。

 

普通录入时的提示/自动补齐

一些软件/JavaScript是擅长于帮助用户完成键入相同的文字或可以预测的文字的工作的。在del.icio.us 和 Gmail 中该功能是非常有益的，可以用来快速增加标记/email等。

 

对于一个频繁使用的应用程序诸如网页邮件客户端或博客阅读器来说，用户有充足的时间来学习如何使用新的UI概念但是他们却无法接受一个非常缓慢的反应速度。这种应用为Ajax变的更加普及起到了一个完美的杠杆作用。随着用户使用频率的增加，更多的Ajax部件应该加强用户的使用体验。

但是对于网页应用程序来说，把每件事甚至任何事都用JavaScript来实现也是没有意义的。Ajax只是针对一些特定的环境才能带来显著的帮助。在Ajax出现之前网页应用程序已经可以工作的很好了并且目前在网页开发中Ajax还存在着许多的缺陷和缺点。就算不从服务器端取得一个异步的信息数据流一个平直的html网页日志也可以工作的很好。对于文档或文档之间的跳转来说，老旧的纯HTML仍然是最好的选择。简单或很少使用的应用程序就算不用JavaScript同样可以很好的工作。

 

下面是一些不应该用到Ajax的地方：

 

简单的表单

就算表单是Ajax技术的最大受益人，一个简单内容的表单，或提交订货单，或一次性的很少用到的表单都不应该使用以Ajax驱动的表单提交机制。总的来说，如果一个表单不是很长用，或已经工作的很好，那么就算使用Ajax也没有什么帮助。

 

搜索

实时搜索带来的痛苦要远大于他带来的帮助。这就是为什么Google Suggest还处于beta测试而并没有放在主页上的原因。在Start.com Live.com上搜索的时候你是不能使用返回按钮来查看上一次搜索或返回上一页的。或许还没有人来完成这项工作，但是完成这个工作应该是很困难的至少是不太明知的或者会因此带来更多的麻烦。（译注：现在已经有很多开源的框架可以实现历史记录功能）

 

基本导航

总的来说，使用Ajax为一个基础的网站/程序做导航是一个可怕的念头。谁会把用来使自己的程序变的更好的时间花在编写代码模仿浏览器的行为上面？在基础页面中导航的操作中JavaScript是没有用的。

 

替换大量的信息

Ajax可以不用整页刷新来动态更新页面中改变的一小部分。但是如果一页上的大部分内容都需要更新，那为什么不从服务器那里获得一个新页面呢？

 

显示操作

虽然看上去Ajax是一个纯UI技术，其实不是这样的。他实际上是一个数据同步、操作、传输的技术。要想得到一个稳定的干净的网页程序，不使用Ajax/JavaScript来直接完成用户接口是明智的。JavaScript可以分散分布并简单的操作XHTML/HTML DOM，根据CSS规则来决定如何让UI显示数据。查看

这里（http://www.sourcelabs.com/blogs/ajb/2005/08/powering_javascript_ui_with_cs.html）

来查看如何使用CSS来替代JavaScript来控制数据的显示。

 

无用的网页小部件

滑块选择控件、拖拽控件、弹性控件（此处原文为bouncies，不知指为何物？）、鼠标样式、天气预报控件，这些小部件应该可以被更直接的控件代替或者为了整洁干脆整个去掉。为了选择一种颜色，也许滑块选择控件可以选择一个正确的阴影颜色，但是在一个商店中选择一个价格，使用滑块选择控件选到分这个单位对于用户来说有点过分。

 

OK我在标题那里撒了个无伤大雅的小谎，我只说出了6个应该使用Ajax的地方，6个也许不应该使用的地方，但是多从四维的角度看看这篇文章，我已经在SWiK上面为Ajax的使用建立了一个wiki页面（http://swik.net/Ajax/Places+To+Use+Ajax）并且我或任何其他人都可以随着时间的流逝来不断的完善他。

另外，我现在尝试使用Feedburner来跟踪我的RSS种子，如果你没有订阅Feedburner种子，请到这里订阅http://feeds.feedburner.com/AlexBosworth

评论

17 楼 treenode 2007-03-17  

zjumty 写道

flex 2其实bug也是很多的。

实际应用中也会出现很多问题。

问一下，Flex2有哪些bug？
我们现在也很关心这个问题，因为公司正在考虑把Flex应用到项目中的可能性。

16 楼 zjumty 2007-03-17  

flex 2其实bug也是很多的。

实际应用中也会出现很多问题。

15 楼 lordhong 2007-03-17  

flex 2统统搞定...

14 楼 dada 2007-03-16  

benjaminz 写道

所以像这种超复杂或超量数的请求，还不如使用相关的工具生成excel格式的文档供普通用户下载来的方便，至少在国内的大多数办公机器上office是肯定有的工具吧。。。

我的意思是：我一般依靠后台而不是js处理复杂查询，当然同时提供一个excel导出功能。
js的数据过滤对我而言没有什么特殊的意义。

13 楼 benjaminz 2007-03-16  

dada 写道

引用

过滤和复杂数据操作
应用一个过滤、按日期排序、按日期和姓名排序、打开或关闭过滤器等等。任何一种高交换型操作应该交给JavaScript来处理而不是通过向服务器来提交一系列的请求。在查找或者操作大量数据的时候带来的视图上的改变最多不会超过30秒，Ajax真的使这些操作加速了。

这点不同意。过滤和复杂数据操作更多的出现在大数据量的查询上，一般这种操作我们都是展现分页后的数据。
这让人很难想象用户有对分页中的某一页作数据过滤和排序的需求。
另外，靠js实现的数据过滤和排序对性能的瓶颈主要在cpu上，当数据达到一定规模时用户体验甚至不如向服务器提交请求。

所以像这种超复杂或超量数的请求，还不如使用相关的工具生成excel格式的文档供普通用户下载来的方便，至少在国内的大多数办公机器上office是肯定有的工具吧。。。

12 楼 benjaminz 2007-03-16  

[e-mail] 写道

搜索为什么不能用AJAX呢？说麻烦大于好处，麻烦有那些呢？

作者的意思估计是搜索如果使用ajax来实现的话，就无法形成历史记录，无法给你的搜索加上书签等等

11 楼 dada 2007-03-16  

引用

过滤和复杂数据操作
应用一个过滤、按日期排序、按日期和姓名排序、打开或关闭过滤器等等。任何一种高交换型操作应该交给JavaScript来处理而不是通过向服务器来提交一系列的请求。在查找或者操作大量数据的时候带来的视图上的改变最多不会超过30秒，Ajax真的使这些操作加速了。

这点不同意。过滤和复杂数据操作更多的出现在大数据量的查询上，一般这种操作我们都是展现分页后的数据。
这让人很难想象用户有对分页中的某一页作数据过滤和排序的需求。
另外，靠js实现的数据过滤和排序对性能的瓶颈主要在cpu上，当数据达到一定规模时用户体验甚至不如向服务器提交请求。

10 楼 foxgst 2007-03-15  

总觉得现在的Ajax还是不够方便，按照这样的发展趋势，以后的浏览器势必会增加客户端体验，到时候会更加容易。

9 楼 mhbjava 2007-03-15  

楼上说的是

8 楼 mildforest 2007-03-15  

使用ajax虽然很好，但是有时小数据传输后，想回到原来的页面就难了，有点麻烦。
现在163邮箱，也是用了ajax，虽然一开始加载慢，到后面还是很爽的。

7 楼 过河卒 2007-03-15  

搜索为什么不能用AJAX呢？说麻烦大于好处，麻烦有那些呢？

6 楼 Duno 2007-03-15  

简单的说就是：不需要替换整个页面的情况下就可以使用ajax，但这样极易导致ajax滥用，有时候还是很怀念forward page那种方式啊，简单！

5 楼 benjaminz 2007-03-15  

有哪位兄弟可以给解释下bouncies这个词到底是指的哪个网页小部件？谢谢

4 楼 cozone_柯中 2007-03-14  

学习了

3 楼 lennonwang 2007-03-14  

在我们实际的项目中使用ajax的还有
1.表格数据的刷新和删除。
2.动态级联页面的生成。

2 楼 bigpanda 2007-03-14  

ActiveX是Browser Plugin，Firefox有自己的一套Plugin机制。这两个都要在local computer安装程序，JavaScript和CSS不用安装程序。但是有些东西，单靠JavaScript和CSS是搞不定的。这时就要靠Plugin了。

HTML form, Ajax, Browser Plugin, 三板斧头轮过去，什么事情都搞定了。

1 楼 ray_linn 2007-03-14  

如果ActiveX没那么多bug的话，貌似可以统统替代掉，AJAX的明天也许还是activex++--.....