`

为什么使用和不使用Ajax?

阅读更多
Ajax适用场景

  1.表单驱动的交互

  传统的表单提交,在文本框输入内容后,点击按钮,后台处理完毕后,页面刷新,再回头检查是否刷新结果正确。使用Ajax,在点击sunmit按钮后,立刻进行异步处理,并在页面上快速显示了更新后的结果,这里没有整个页面刷新的问题。

2.深层次的树的导航

  深层次的级联菜单(树)的遍历是一项非常复杂的任务,使用JavaScript来控制显示逻辑,使用Ajax延迟加载更深层次的数据可以有效的减轻服务器的负担。

  我们以前的对级联菜单的处理多数是这样的:

  为了避免每次对菜单的操作引起的重载页面,不采用每次调用后台的方式,而是一次性将级联菜单的所有数据全部读取出来并写入数组,然后根据用户的操作用 JavaScript来控制它的子集项目的呈现,这样虽然解决了操作响应速度、不重载页面以及避免向服务器频繁发送请求的问题,但是如果用户不对菜单进行 操作或只对菜单中的一部分进行操作的话,那读取的数据中的一部分就会成为冗余数据而浪费用户的资源,特别是在菜单结构复杂、数据量大的情况下(比如菜单有 很多级、每一级菜又有上百个项目),这种弊端就更为突出。

  如果在此案中应用Ajax后,结果就会有所改观:

  在初始化页面时我们只读出它的第一级的所有数据并显示,在用户操作一级菜单其中一项时,会通过Ajax向后台请求当前一级项目所属的二级子菜单的所有数据,如 果再继续请求已经呈现的二级菜单中的一项时,再向后面请求所操作二级菜单项对应的所有三级菜单的所有数据,以此类推……这样,用什么就取什么、用多少就取 多少,就不会有数据的冗余和浪费,减少了数据下载总量,而且更新页面时不用重载全部内容,只更新需要更新的那部分即可,相对于后台处理并重载的方式缩短了 用户等待时间,也把对资源的浪费降到最低。

  3.快速的用户与用户间的交流响应

  在众多人参与的交流讨论的场景下,最不爽的事情就是让用户一遍又一遍刷新页面以便知道是否有新的讨论出现。新的回复应该以最快的速度显示出来,而把用户从分神的刷新中解脱出来,Ajax是最好的选择。

  4.类似投票、yes/no等无关痛痒的场景

  对于类似这样的场景中,如果提交过程需要达到40秒,很多的用户就会直接忽略过去而不会参与,但是Ajax可以把时间控制在1秒之内,从而更多的用户会加入进来。

  5.对数据进行过滤和操纵相关数据的场景

  对数据使用过滤器,按照时间排序,或者按照时间和名称排序,开关过滤器等等。任何要求具备很高交互性数据操纵的场合都应该用JavaScript,而不是用一系列的服务器请求来完成。在每次数据更新后,再对其进行查找和处理需要耗费较多的时间,而Ajax可以加速这个过程。

  6.普通的文本输入提示和自动完成的场景

  在文本框等输入表单中给予输入提示,或者自动完成,可以有效的改善用户体验,尤其是那些自动完成的数据可能来自于服务器端的场合,Ajax是很好的选择。

 Ajax不适用场景

  1.部分简单的表单

  虽然表单提交可以从Ajax获取最大的益处,但一个简单的评论表单极少能从Ajax得到什么明显的改善。而一些较少用到的表单提交,Ajax则帮不上什么忙。

  2.搜索

  有些使用了Ajax的搜索引擎如Start.com和Live.com不允许使用浏览器的后退按钮来查看前一次搜索的结果,这对已经养成搜索习惯的用户来说是不可原谅的。

  现在Dojo通过iframe来解决这个问题。

  3.基本的导航

  使用Ajax来做站点内的导航是一个坏主意,为什么不把时间放在让系统程序作的更好上呢?

  4.替换大量的文本

  使用Ajax可以实现页面的局部刷新,但是如果页面的每个部分都改变了,为什么不重新做一次服务器请求呢?

  5.对呈现的操纵

  Ajax看起来像是一个纯粹的UI技术,但事实上它不是。它实际上是一个数据同步、操纵和传输的技术。对于可维护的干净的web应用,不使用Ajax来控制页面呈现是一个不错的主意。JavaScript可以很简单的处理XHMTL/HTML/DOM,使用CSS规则就可以很好的表达数据显示。

  存在的问题

  1.用JavaScript作的Ajax引擎,JavaScript的兼容性和DeBug都是让人头痛的事;

  2.Ajax的无刷新重载,由于页面的变化没有刷新重载那么明显,所以容易给用户带来困扰?D?D用户不太清楚现在的数据是新的还是已经更新过的;现有的解决有:在相关位置提示、数据更新的区域设计得比较明显、数据更新后给用户提示等;

  3.中间过程不能被bookmark。解决方法:GoogleMaps通过在页面上提供一个”link to this page”的办法来解决。另外,还可以通过url链接中加无效的?^标记来解决,但还未验证。 我觉得ibm开发者论坛中有个老大不记得什么名字了说的不错 跟j2ee的现有成熟表现层框架结合使用是比较好的一个选择。因需而用不会给自己断掉很多后路。一味的尝试或许就有苦果等待、诱惑、刺激、引导你失去理智。
分享到:
评论
5 楼 hyj1254 2012-08-03  
jxb1016 写道
我想补充一点,就是AJAX是一种异步请求处理的技术,那么对请求处理的的顺序和返回的顺序都是不固定的,这样的话就不适合做工作流的处理了.

完全不是问题,后续逻辑都放在回调函数里面。这样做唯一的缺点就是代码变成了意大利拉面。
4 楼 coralsea 2010-04-27  
EldonReturn 写道
总体来说Ajax最大的问题就是它的不稳定,随时因为网络或者客户端的限制而挂掉,影响用户使用和体验。


不稳定?这还是头一次听说
3 楼 EldonReturn 2010-04-26  
总体来说Ajax最大的问题就是它的不稳定,随时因为网络或者客户端的限制而挂掉,影响用户使用和体验。
2 楼 coralsea 2010-04-26  
jxb1016 写道
我想补充一点,就是AJAX是一种异步请求处理的技术,那么对请求处理的的顺序和返回的顺序都是不固定的,这样的话就不适合做工作流的处理了.


Ajax和工作流没有关系吧?
首先,Ajax的异步请求处理的特点和业务逻辑操作流程没有依赖关系。在一个页面中保证多个操作的顺序是非常容易的,最简单的就是禁止重复提交了。
其次,工作流的一个特征就是多人参与,如果只是一个人在一个页面做那就没必要用工作流系统了。。。
1 楼 jxb1016 2010-04-21  
我想补充一点,就是AJAX是一种异步请求处理的技术,那么对请求处理的的顺序和返回的顺序都是不固定的,这样的话就不适合做工作流的处理了.

相关推荐

    什么是Ajax和json???

    ### 什么是Ajax和JSON? #### 1. Ajax详解 ##### 1.1 定义Ajax **Ajax**(Asynchronous JavaScript and XML)是一组技术的集合,这些技术结合在一起能够实现浏览器端对用户请求的异步处理,从而提高用户体验。...

    Ajax介绍,为什么用ajax

    #### 为什么使用Ajax Ajax的主要优势在于: - **提升用户体验**:通过局部更新网页,避免了页面的整体刷新,大大减少了用户的等待时间。 - **节省带宽**:仅传输需要更新的数据,而不是整个页面,节约了网络资源。 -...

    如何 不使用ajax缓存

    ### 如何不使用Ajax缓存 在Web开发中,Ajax技术因其异步通信特性而被广泛应用,但在实际项目中可能会遇到缓存问题,比如在进行数据更新操作时(如删除、修改),由于浏览器缓存的存在导致请求返回的是之前的数据...

    json ajax ajax框架

    在使用JSON和AJAX框架时,我们需要注意以下几点: 1. **数据格式化**:JSON格式规定了键值对的表示方式,如`{"key": "value"}`,确保数据在服务器和客户端之间能正确解析。 2. **跨域安全**:由于同源策略的限制,...

    AJAX使用场景分析

    尽管AJAX在许多场景下都能带来积极的影响,但也存在一些不适合使用AJAX的情况: - **简单的表单**:对于简单的表单提交,使用AJAX可能并不会带来明显的改善。 - **搜索**:某些使用了AJAX的搜索引擎不允许用户使用...

    ajax使用简单demo

    本教程以一个简单的Ajax使用示例为基础,帮助初学者理解并掌握其基本概念和使用方法。 ### 1. Ajax的基本工作原理 Ajax的核心是JavaScript对象XMLHttpRequest,它允许JavaScript向服务器发送HTTP请求,并接收...

    Bootstrap进度条与AJAX后端数据传递结合使用实例详解

    然后,使用AJAX技术发送POST请求到服务器,并将服务器返回的数据展示在页面上。最后,通过设置进度条的值,可以控制进度条的长度,提高用户体验。 Bootstrap进度条与AJAX后端数据传递结合使用可以实现在页面不刷新...

    结合使用 Ajax 和 WebSphere Portal

    最后,如果应用程序的页面切换并不需要频繁的数据更新,那么过度使用Ajax可能并不合适。 在设计Ajax应用时,有几点需要注意: 1. **模型逻辑的分离**:在使用Ajax的门户应用中,需要考虑如何在多个控制器之间保持...

    什么是Ajax?Ajax的优缺点共2页.pdf.zip

    3. **首屏加载问题**:初次加载页面时,无法使用Ajax,仍需加载完整页面。 4. **兼容性问题**:不是所有浏览器都支持Ajax,尤其是老版本或非主流浏览器。 5. **安全问题**:Ajax请求可能导致跨站脚本攻击(XSS)和跨...

    AJAX下载和安装部署使用说明

    本文将详细介绍如何下载、安装和使用AJAX Control Toolkit。 ### 第一步:安装Ajax Control Toolkit 1. **下载Ajax Control Toolkit**:可以从CodePlex...

    基于MVC用JSPServlet实现JPetStore实验报告+使用AJAX和jQuery改善用户体验实验报告.doc

    在JPetStore应用中,可以使用AJAX来异步加载商品信息,例如,当用户滚动页面时,可以动态加载更多产品,而不是一次性加载所有内容,这减少了页面加载时间。jQuery可以用于封装AJAX请求,简化代码,同时处理用户交互...

    在外部方法使用Ajax请求返回的数据

    在JavaScript的世界里,Ajax(Asynchronous JavaScript and XML)是一种创建动态网页的技术,它允许在不刷新整个页面的情况下,与服务器交换数据并更新部分网页内容。jQuery是一个强大的JavaScript库,它简化了...

    JS使用AjAX实例,JQUERY使用AJAX实例

    以上内容涵盖了JS和jQuery使用AJAX的基本方法,以及如何调用WebService和ASHX。在VS环境下,这些技术可以帮助开发者创建更动态、用户体验更好的Web应用。在实际开发中,需要注意跨域问题、错误处理、数据格式化等...

    SpringBoot+SpringSecurity处理Ajax登录请求问题(推荐)

    由于Ajax请求不像传统的表单提交那样可以使用Spring Security的默认配置,因此我们需要特殊处理Ajax登录请求问题。 知识点3:解决方案 为了解决Ajax登录请求问题,我们可以使用Spring Security的 Ajax 登录请求...

    asp.net下简单使用ajax

    ASP.NET 下的 AJAX 使用主要涉及前端 JavaScript 和 jQuery 技术,以及后端 ASP.NET 的交互。AJAX(Asynchronous JavaScript and XML)允许我们在不刷新整个页面的情况下与服务器进行异步数据交换,提升用户体验。...

    什么是Ajax?Ajax的优缺点.pdf

    Ajax,全称异步JavaScript和XML,是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。这个概念最早由Jesse James Garrett在2005年提出,它整合了多种前端和后端技术,包括JavaScript、XMLHttpRequest...

    Ajax使用项目案例

    在"AjaxShow"案例中,可能会包含一个简单的网页,该网页使用Ajax技术向服务器请求数据,然后动态地在页面上显示这些数据。这可能是通过点击按钮、输入框改变或其他用户交互触发的。案例可能还会涉及错误处理、数据...

    什么是Ajax?Ajax的优缺点.docx

    **什么是Ajax** Ajax,全称为"Asynchronous JavaScript and XML",是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。这种技术通过JavaScript与服务器进行异步数据交换,并使用XML(可扩展标记语言)...

    AJAX中不触发javascript事件

    标题中的“AJAX中不触发javascript事件”指的是在使用AJAX技术进行页面更新时,可能出现JavaScript事件不按预期触发的情况。这通常是由于AJAX请求更新页面部分时,不会触发表单提交、点击或其他依赖于页面刷新的...

Global site tag (gtag.js) - Google Analytics