作者:Alex Bosworth 创作时间:2005-12-01
译者:benjaminz@eyou.com 翻译时间: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,不知指为何物?)、鼠标样式、天气预报控件,这些小部件应该可以被更直接的控件代替或者为了整洁干脆整个去掉。为了选择一种颜色,也许滑块选择控件可以选择一个正确的阴影颜色,但是在一个商店中选择一个价格,使用滑块选择控件选到分这个单位对于用户来说有点过分。
分享到:
相关推荐
1. **创建XMLHttpRequest对象**:这是Ajax的核心,几乎所有的浏览器都内置了这个对象,用于与服务器进行异步通信。例如: ```javascript var xhr = new XMLHttpRequest(); ``` 2. **设置回调函数**:当服务器...
标题中的“自己写个后台管理,用到了ajax”意味着这篇博客或者项目是关于构建一个自定义的后台管理系统,并且在实现过程中使用了Ajax技术。Ajax(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的...
综上所述,虽然“JQueryAjax用到的jar包”这个标题可能有些误导,因为jQuery本身是JavaScript库,不需要jar包。但在Java Web环境中,为了实现jQuery Ajax功能,我们可能需要用到处理JSON或XML数据的Java库,例如...
这篇博客“java web常用到的ajax分页思路”可能就是探讨如何结合Ajax与后端技术实现高效、动态的分页。 在传统的Web应用中,用户每次点击分页按钮,整个页面都会重新加载。而使用Ajax,我们可以在后台获取新的分页...
**Ajax 实例详解** ...这个Ajax实例涵盖了基本的Ajax应用流程,通过学习和实践,你可以更好地理解Ajax的工作原理以及在实际项目中的应用。对于前端开发者来说,掌握Ajax技术是提高网页交互性的关键技能。
标题 "ajax提交的时候用到的图片" 暗示了我们将在讨论的场景涉及到使用Ajax技术来异步提交数据,并且在这个过程中可能涉及到一个加载指示器(spinner.gif)来显示请求处理的状态。Ajax,即Asynchronous JavaScript ...
它是ASP.NET平台上著名的AJAX框架,诞生于2005年2月(虽然正式命名为AJAX.NET则是在两个月之后),作者为Michael Schwarz。同年10月,Michael为AJAX.NET提供了更丰富的功能(主要是安全性方面),并将其改名为AJAX...
总的来说,这个“ajax异步提交转json需要用到的jar”集合提供了一个全面的环境,帮助开发者在Web应用中轻松实现AJAX无刷新验证,利用JSON进行高效的数据交换。开发者应当根据项目需求选择合适的jar文件,并结合前后...
"AjaxJson"可能指的是一个特定的框架或库,但通常在Java后端,我们可以创建一个RESTful API,接收并响应JSON数据。在Spring框架中,可以通过注解`@RestController`和`@RequestBody`轻松实现: ```java @...
jquery中ajax方法有个属性async用于控制同步和异步,默认是true,即ajax请求默认是异步请求,有时项目中会用到AJAX同步。这个同步的意思是当JS代码加载到当前AJAX的时候会把页面里所有的代码停止加载,页面出现
【描述】"test ajax ajax 测试 tomcat6跑工程"表明这个测试项目是在Tomcat 6服务器上运行的。Tomcat是一个开源的Java Servlet容器,广泛用于部署Java Web应用。这里提到的"ajax 测试"可能是指创建了一个或多个AJAX...
而“用到了Ajax DHTML”则表明该系统在用户界面和交互方面采用了先进的Web技术,使得投票过程更为动态和实时。 【描述】中提到,“我和我们老师一起做的系统”,这暗示了这是一个教学或实践项目,可能是学生与导师...
在构建Ajax聊天室时,我们需要结合多种Web技术,包括HTML、CSS、JavaScript、XML以及可能用到的JSON,来创建一个实时交互的聊天环境。 **1. 前端设计** 前端是用户直接接触的部分,主要由HTML和CSS组成。HTML用于...
在IT领域,构建一个在线社区...学习这个项目,你可以了解到如何整合ASP.NET和AJAX技术,以及如何设计和实现一个基本的实时聊天系统。这将有助于提升你对Web开发的理解,特别是涉及到用户交互和服务器响应的优化方面。
5. **jQuery**和**jQuery UI**:虽然不是ASP.NET AJAX的一部分,但常与之一起使用,提供更强大的DOM操作和用户界面组件。 6. **JSON**(JavaScript Object Notation):通常用于在AJAX请求中传递数据,因为其轻量级...
var names; var Cs, St; var rorw=””; var lrcT; function getname(songname){ ... } function geturl(){ AJAXCALL(“inc/songurl.asp?type=url1&keyword=”+names,”musiclist”,”isXML=true”); addbox(nam
**Ajax 页面交互与 Ashx** Ajax(Asynchronous JavaScript and XML)是一种在不重新加载整个网页的情况下,能够更新部分网页的技术。这种技术的核心在于利用JavaScript进行异步数据交换,提升了用户体验,使得网页...
在实现这个功能时,ASP.NET AJAX的核心组件`ScriptManager`会被用到,它负责在客户端加载必要的AJAX库。此外,`UpdatePanel`控件也可能会被添加到`Default.aspx`页面,它创建了一个可以异步更新的区域,这样在下拉框...
类名:AJAX 代码如下:/*类名:AJAX 创建方法:var ajaxobj=new AJAX;,如果创建失败则返回false 属性:method – 请求方法,字符串,POST或者GET,默认为POST url – 请求URL,字符串,默认为空 async – ...
标题提到的"SpringMVC与Ajax交互需要的三个包"是Jackson库的三个核心组件: 1. **jackson-annotations-2.9.6.jar**:这是Jackson的注解模块,提供了丰富的注解,如`@JsonAutoDetect`、`@JsonProperty`、`@...