`
javadingle2008
  • 浏览: 66182 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

AJAX应用篇:必须用到和不必使用的地方

阅读更多
下面是当前网页应用程序应该出现的地方:

基于表单的交互

表单是很慢的,非常慢。尝试编辑位于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显示数据。

无用的网页小部件

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

0
3
分享到:
评论

相关推荐

    超炫效果的jQuery相册插件

    同时,考虑到现代Web应用的异步加载需求,"ajax"标签提示我们这个插件可能使用了jQuery的$.ajax()或$.get()、$.post()方法来动态加载相册图片,从而提升用户体验,避免一次性加载所有图片导致页面加载过慢。...

    jQuery网页右下角悬浮在线客服代码

    本篇将详细介绍如何使用jQuery实现一个网页右下角悬浮的在线客服代码。 首先,我们需要理解jQuery的基础知识。jQuery是一个轻量级的JavaScript库,它简化了HTML文档遍历、事件处理、动画以及Ajax交互等任务。通过...

    ExtAspNet v2.2.1 (2009-4-1) 值得一看

    ExtAspNet是一组专业的Asp.net控件库,拥有原生的AJAX支持和丰富的UI效果, 目标是创建没有JavaScript,没有CSS,没有UpdatePanel,没有WebServices的Web应用程序。 支持的浏览器: IE 7.0+, Firefox 3.0+, Chrome ...

    jquery一步步开发弹窗组件(1)

    《jQuery逐步构建弹窗组件(1)》这篇文章主要介绍了如何使用jQuery来开发一个自定义的弹窗组件。在Web开发中,弹窗组件是常见且重要的交互元素,它用于显示通知、确认信息、用户输入等。本文将从基础出发,通过一步步...

    ExtAspNet_v2.3.2_dll

    ExtAspNet是一组专业的Asp.net控件库,拥有原生的AJAX支持和丰富的UI效果, 目标是创建没有ViewState,没有JavaScript,没有CSS,没有UpdatePanel,没有WebServices的Web应用程序。 支持的浏览器: IE 7.0+, Firefox...

    jQuery鼠标左右键自定义菜单代码.zip

    《jQuery鼠标左右键自定义菜单代码详解》 在网页开发中,交互性的增强往往能提升用户的体验感。...通过理解和实践这一代码,我们可以更好地掌握jQuery在网页交互中的应用,提升自己的前端开发技能。

    海康NVR,WEB开发大全.zip

    WEB开发则是通过Web界面来实现对NVR的远程控制和管理,提供用户友好的图形化操作,使得在任何地方只要有网络连接,就能访问和操作NVR。这篇资料集合显然包含了关于如何进行海康NVR的WEB开发的详细教程和官方插件资源...

    基于JQuery 的 右下角动画展开消息提示

    首先,jQuery是一个广泛使用的JavaScript库,它简化了DOM操作、事件处理、动画制作和Ajax交互等多个方面,使得开发者能更高效地创建动态和交互式的网页。在实现右下角动画展开消息提示时,jQuery的强大力量得以显现...

    最好的asp CMS系统科讯CMSV7.0全功能SQL商业版,KesionCMS V7.0最新商业全能版-免费下载

    科汛cms实现了“网站模板与程序完全分离”的新概念,独创ajax输出和JS标签跨站调用,支持不同频道、栏目、专题、内容页应用不同的模板,支持批量绑定模板,模板换肤更是一键之谈。 模板制作也非常方便,用户可以...

    好看的jsp日历插件

    在本篇文章中,我们将深入探讨这个插件,以及它如何在网页应用中实现日期选择功能。 首先,我们要理解pop.js插件的核心功能。正如其名,pop.js提供了一个弹出式日历,用户可以通过点击或者交互触发这个日历,方便地...

    上传_上传代码_

    阅读这份文档将有助于深入理解整个上传过程,包括可能用到的技术和关键代码片段。 总之,文件上传功能的实现涵盖了前端交互、后端处理以及安全策略等多个方面,是Web开发中的基础但重要的一环。通过理解并实践...

    使用layui定义一个模块并使用的例子

    这个例子将通过一个场景来演示,例如在表单操作中,需要在多个页面上用到某个特定的功能,这时候可以将它定义成模块,以便在任何需要的地方调用。 ### 描述知识点解析 **参考价值**:提供的代码示例具有较高的参考...

    jQuery数字滚动播放动画特效

    本篇文章将深入探讨“jQuery数字滚动播放动画特效”的实现原理和应用,以及如何利用jQuery库创建这样的效果。 首先,jQuery是一个轻量级的JavaScript库,它简化了HTML文档遍历、事件处理、动画和Ajax交互等任务。在...

    FunnyStoriesFront:糗事百科前台页面

    用户输入关键词后,前端可以即时过滤数据,展示匹配的趣事,这通常需要用到正则表达式和字符串操作。对于更复杂的搜索逻辑,可能还需要结合后端的API接口进行处理。 在趣事百科的前端页面中,用户评论和点赞功能也...

    jQuery input文本框点击下拉选择特效代码

    在网页开发中,jQuery是一个非常流行的JavaScript库,它极大地简化了JavaScript的DOM操作,事件处理,动画制作和Ajax交互。本篇文章将详细讲解如何利用jQuery实现一个点击input文本框后出现下拉选择的特效代码。 ...

Global site tag (gtag.js) - Google Analytics