10大加速Ajax开发的框架

2016-02-19 19:21 6 1 收藏

在这个颜值当道,屌丝闪边的时代,拼不过颜值拼内涵,只有知识丰富才能提升一个人的内在气质和修养,所谓人丑就要多学习,今天图老师给大家分享10大加速Ajax开发的框架,希望可以对大家能有小小的帮助。

【 tulaoshi.com - Web开发 】

随着Ajax盛行,许多网站纷纷采用这项技术,而这股时代趋力的背后,各式各样的Ajax框架可说是最大的功臣,让开发人员不用重造轮子,省去从JavaScript底层重新开始构造程式的工作。

不过开发人员也许会疑惑,Ajax不就是JavaScript吗?简单的脚本程式还需要框架?事实上,Ajax框架的确能带来许多好处。

简化JavaScript的使用难度

许多开发人员低估JavaScript的难度。过去JavaScript往往被当作是扰人的小玩意,不是弹跳出视窗,就是跑马灯、动态文字等花俏的应用。然而JavaScript独特的物件观念与灵活的语法,赋予它深入操作文件物件模型(DOM)与操控CSS的强大能力,而能够充分应用浏览器XMLHttpRequest物件,更打下今日Ajax大片江山。

要全盘掌握这些应用,并没有想像中容易,由于实作的方式充满弹性,只要检视各个框架语法,就可发现它们之间的差异性之大。但现存的各种框架致力于简化JavaScript的应用难度,因此使用Ajax框架,能让开发人员更快专注在开发工作上。

解决烦人的浏览器相容性问题

即使开发人员功力深厚,可以轻松驾驭JavaScript语法,然而一旦遇到琳琅满目的各式浏览器,通常也得败下阵来。

不同浏览器对文件的解析与语法的支援并不一致,在各种作业系统或版本上有时也会表现出不同的行为(例如IE6与IE7的差异),让许多JavaScript应用程式的瓶颈,都发生在相容性上。

使用Ajax框架的好处之一,便是它已经预先为开发人员解决浏览器相容性问题。

开发流程变得更单纯

开发过非同步传输程式经验的人,就一定能体会撰写过程相当烦琐,必须检查回传状态、指定后端应用程式和回呼程式等细节,而这些流程,Ajax框架通常会予以简化,减少开发人员与细节奋斗的时间。

另外,许多Ajax框架都提供了拖曳元件、动画效果、动态选单等,只需指定方法就能使用,节省不少开发力气。

不过Ajax框架实作的方式各不相同,有些JavaScript语法开发,也有的用.NET或Java实作;除了在用户端执行,也有利用伺服器端来实现的方式。我们特别选出十种Ajax框架,让开发人员了解各项Ajax框架的适用性。

1. APS.NET的官方解决方案

ASP.NET AJAX

ASP.NET AJAX是微软.NET平台上的解决方案,提供涵盖伺服器端与用户端所需的AJAX技术与JavaScript整合机制。

透过与下载与安装ASP.NET AJAX到Visual Studio 2005当中,即可利用预设的控制项,开发出一些视觉特效与非同步传输的应用。

另外,ASP.NET AJAX也提供控制项的Toolkit,包含开发人员想自行开发AJAX应用时所需的基底类别与专案范本。

ASP.NET AJAX除了处理浏览器的相容性问题,也让用户端的JavaScript在开发时加入物件导向特性,例如型别系统、资料型别、命名空间、事件等,使得程式码更容易除错、维护与重复使用。

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)

虽然ASP.NET AJAX提供伺服器与用户端的解决方案,透过Visual Studio2005加持,也让开发、除错的难度降低,不过和其他AJAX框架相比,许多AJAX效果和功能都还在测试阶段(在CTP版本中供用户测试),可以应用的功能有限。

2.支援「上一页」与加入「我的最爱」功能
Dojo

一些轻巧的Ajax框架,用意在解决JavaScript遇到的易用性或特效问题,相较之下,Dojo更像是个面面俱到的JavaScript工具套餐,号称可以降低网页或网页应用程式前端开发速度。

Dojo支援拖拉、淡出、淡入、移动、透明、操作SVG图档等动态效果,它的Widget也让使用者可以轻易使用选单,分页标签(tab)、树状结构、日历、文字编辑器等效果,当然也支援非同步处理的Ajax功能。

另外,Ajax由于以动态的方式操作文件物件,导致使用者习于使用上一页、下一页的功能无法使用,也无法利用像是「我的最爱」的功能,将使用者所需的页面留下正确的书签,但这些需求Dojo都已有解法。

比起其他轻巧型的Ajax框架,要摸熟Dojo显然要下较多的功夫才能掌握,目前文件较少也是个问题。不过由于它的功能更为完整,因此开发人员需要自行加工的地方就相对较少。

3.可由JavaScript呼叫Java语法
DWR(Direct Web Remoting)

DWR是设计给Java语言的Ajax框架,让开发人员可以利用JavaScript程式呼叫Java语法。

DWR的运作可分为两个部分,一方面用在浏览器上,处理连接伺服器端Java程式,另一部分则是用来展示回传资料。透过DWR呼叫Java的函式,它会处理连接处理的细节,而当资料被处理完成后,DWR就会执行回呼函式,以进行后续呈现的处理。

在安装DWR时必须编辑Web应用程式的部署描述档案,而且也要编辑DWR特定档案。 DWR配置档案指定了可以远端建立和呼叫的类别。档案中包含伺服器程式码的JAR档案,另外还有JavaScript档案,提供一些辅助函式,处理互动呈现的效果。

DWR最大的好处就在于让Java开发人员可以利用熟悉的语法来处理页面与资料,并且能配合Struts、Tapestry来使用。不过从用户端呼叫远端伺服器的Java程式,仍存在一些安全上的疑虑,在使用时必须注意。

4.以易用性、简化语法为目标
jQuery

jQuery是最近大受瞩目的Ajax框架,它以Prototype为本,简化并提升JavaScript语法的功能。

jQuery有点像是将Prototype所做的事再推向极端,让使用者改变原有撰写JavaScript的方法。它最为人称道的地方,就在于强大的存取页面元素功能,无论是文件的节点、CSS的选取子或Xpath表达式,都能利用「$( )」函式快速存取,并赋予它更多的功能。

此外,它的chainable方法能将一串处理函式结合在一起,让程式码更为简洁。另外jQuery也提供一些动态效果,不过和其他框架相比,这部分就显得阳春许多。

jQuery的优劣其实都在同一件事情上,一方面它简化JavaScript的语法,让撰写程式更为简便,就好用的目的而言,的确是相当成功。然而这却让JavaScript的程式码会发展成另一种样子,对于初学者而言,一开始学习时,必须要花点时间去适应。

5.依功能需求,下载模组化工具
MooTools

前身是以轻巧著称的Moo.fx,与Prototype有着相似的概念和语法,但在物件导向上做得更为彻底,而且在动画效果和互动行为上,提供更多的功能与应用,能让使用者更快的写出物件导向概念的JavaScript语法。

MooTools的下载档依模组分为核心、类别、原生语法、网页元素、浏览器视窗、动画效果、拖曳、远端传输与外挂程式,除了核心程式是必要下载之外,其他可依使用者需求,下载所需的JavaScript档案,借此减少档案的体积。

虽然MooTools将JavaScirpt物件导向化的结果做得更彻底,有利于程式的扩展与维护,不过也挑战原先熟悉JavaScript物件观的人,需要较多的时间适应。

不过无论是网站本身呈现、程式语法展示,甚至是模组下载介面,MooTools都展现相当精致的动态效果,参与网站的示范,很快就能实作。

6.大大扩充JavaScript基本功能
Prototype
网址:prototype.conio.net

Prototype不像其他框架,有许多炫人耳目的动态效果,而是专注在改良JavaScript本身的功能,让JavaScript更容易使用,也更具物件导向风格。

Prototype在简化JavaScript方法上,提供许多方便的语法,最著名的如「$( )」函式,只要将DOM节点的ID传入这个函式,就能取得这个节点物件,简化了DOM的操作方法。而这个方式也几乎成为其他开发框架延用的功能。其他如「$F( )」函数能直接处理Web表单元件的值,「$A( )」函数能将列举的字串转换成阵列等,都是Prototype经典功能。

在非同步处理上,它也提供了Ajax.Request、Ajax.Updater等类别,让开发人员在处理非同步运作时可以利用它提供的方法,让沟通行为更为容易、正确。

虽然Prototype没有太多花俏的功能,不过它简化JavaScript的特性,仍让许多Web开发人员衷情于它。

7.平顺、丰富的动画效果
Rico
网址:openrico.org

Rico是基于Prototype之上的Ajax框架,在西班牙文中,「rico」即为「rich」的意思,这也说明Rico的目标是提供开发人员利用JavaScript达到丰富的网页元件与应用。

Rico提供非同步的Ajax应用,可让非同步回应绕送到一个或多个回呼以操作DOM或JavaScript物件。在动画效果方面,支援如拖曳功能、缩放、过场、进度指标和黄褪技术等,可立即套用丰富的效果。

由于Rico志在让JavaScript也能表现出Flash般的动画效果,因此像是网页元件的颜色、形状或下拉效果的变化都相当平滑,也能让DIV方块做出圆角的效果,让视觉表现更具Web 2.0风格。

Rico的LiveGrid功能同样是为人所称道之处。它能让表单资料产生更多元的表现方式,突破表格的检视行为。例如它可以让使用者在触动卷动轴时,动态下载资料,利用这种方式,可以分段下载,就无需采用分页检视的手法。

8. RoR与CakePHP的指定框架
Script.aculo.us
网址:Script.aculo.us

Script.aculo.us是建立在Prototype之上的Ajax框架,是解决视觉效果与互动行为的轻巧框架,Ruby on Rails及PHP上的开发框架CakePHP等,都是使用Script.aculo.us作为Ajax的解决方案。

在视觉效果上,Script.aculo.us利用改变透明度、大小、位置以及结合以上三种元素,产生更多种变化,例如淡进、淡出、闪动、提示等数十种视觉效果,可让页面效果更具变化,引导使用者与介面程式互动等。

在互动介面方面,提供了拖曳元件、就地编辑元件(In-Place Editor)、水平、垂直拉动卷轴、自动完成、元件排序、购物车等,这些预先打包成套的功能,解决了浏览器相容性的问题,也让使用者很容易可以直接导入在现有的专案功能中,节省自行开发的时间。

此外,Script.aculo.us包含单元测试(Unit Test)框架,可以利用本身的test物件,用来验证程式执行的状态,并且支援模拟滑鼠与键盘的功能。

9.有Yahoo!网站服务背书的框架
Yahoo! User Interface
网址:developer.yahoo.com/yui/

Yahoo! User Interface(YUI)是Yahoo!所提供的Ajax框架,提供便捷的开发方式与许多JavaScript函式库,使用者可以利用它来开发互动式的介面与Ajax效果。 YUI可分为三大部分,包含工具、CSS和控制元件等函式库,工具部分是核心物件,负责一些较底层的处理功能,CSS则提供像版面规画、字体工具。而控制元件则有自动完成、月历、树状结构这些工具。

由于YUI实际应用在Yahoo!的网站中,因此实作的可靠性相当不错,在YUI网站上也提供不少范例与文件,能协助使用者快速上手。虽然YUI是由Yahoo!所推出,不过它遵循JavaScript的语法规则,并将样式、内容与行为分离,开发人员如果要扩充功能,也相当容易。

一般Ajax框架都需要置放在网站的伺服器端,随着页面一起下载,YUI除了采取这种方式之外,也提供使用连结的方式,使用者只要在应用的页面中将路径指向YUI主机即可。

10.适合Java开发环境的企业级解决方案
ZK

ZK是基于Ajax、XUL(XML User Interface Language)、Java网页应用程式的开发框架,让网页的操作行为可以像是桌面应用程式一般。

不同于用户端的Ajax解决方案,ZK由伺服器端出发,利用ZK处理Ajax互动的引擎,处理用户端的页面行为,也因此大为降低利用JavaScript作为动态开发语法时,常遇到的浏览器相容问题。

ZK提供超过70个XUL组件及80个XHTML组件,因此一些网页或应用程式常见的功能,ZK都提供现成的工具可让使用者立即应用,只需利用ZK以XML为基础的使用介面设计语言,即可产生这些组件。应用的人则可在后端利用Java语言进行来处理程式逻辑与资料传递。

由于ZK利用Java语言开发,属于以伺服器为中心的解决方案,因此必须安装支援Java的应用程式伺服器(如Tomcat)才能执行。

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)

来源:http://www.tulaoshi.com/n/20160219/1620786.html

延伸阅读
标签: Web开发
使用如上方法确实可以实现Ajax分页效果,但我总觉得不够简洁,研究了一下午,终于捣鼓出了点东西O_o 首先创建前台页面MyAjaxPager.aspx 代码如下: %@ Page Language="C#" AutoEventWireup="true" CodeBehind="MyAjaxPager.aspx.cs" Inherits="AjaxDemo.AjaxPager.MyAjaxPager.MyAjaxPager" % !D...
标签: Web开发
该版本在性能上有着不少的提升,同时引入一个新的元素元数据的存储系统、新的鼠标事件,兼容最新版的浏览器。同时这也是第一个基于 Sprockets 的发行版,Sprockets 是  Prototype 一个 JavaScript 的打包工具。同时文档也做了改进。 值得关注的特性有: 1. 兼容最新浏览器,包括 Chrome 和 IE 8 2. 元数据存储系统,详情请看这里。 3...
标签: Web开发
项目中某个功能需要同时调用多个ajax,因同步机制,造成了ie假死的现象,自己写了连接池,效果不理想,所以索性从网上DOWN成熟的ajax框架来研究使用。 xajax框架: xajax通过Javascript直接调用PHP函数。它使用Javascript stub来调用PHP脚本中的函数,对象方法,和类方法。服务器端响应由于xajax响应对象创建,该对象提供非常多的命令比如:...
标签: Web开发
项目中某个功能需要同时调用多个ajax,因同步机制,造成了ie假死的现象,自己写了连接池,效果不理想,所以索性从网上DOWN成熟的ajax框架来研究使用。 jqpie框架: 这是一个扩展自jQuery,结合PHP的一个Ajax框架。支持XML,HTML和JSON handler。 利用$.getJSON方法简化来自PHP的请求和处理数据. a href="#" onClick="$.getJSON('handle...
标签: Web开发
这篇文章就会带领你见识一下jQuery的哲学,探讨一下他的特性以及功能,并且会做一些ajax的示例,以及如何使用plug- in(插件)来扩展jQuery。 1. 什么是jQuery? jQuery是个很优秀的Javascript库,它诞生于2006年,出自John Resig之手。不管你是一个 javascript 新手,但是却想尝试一下DOM(Document Object Model)以及Ajax的繁杂,抑或你...

经验教程

200

收藏

56
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部