`
chrisx
  • 浏览: 186406 次
  • 性别: Icon_minigender_1
  • 来自: 天津
社区版块
存档分类
最新评论

浅谈我对几个Web前端开发框架的比较

阅读更多
强调一下,这篇日志主要还是针对想学前端开发的新朋友写的,不是说我有什么独特见解,而是比较客观的状态,就各种框架的异同和应用场合,需要注意的地方做简单描述,不做具体深入分析,有的地方比较抽象,对于抽象之处大家可以到网上或各大高手博客中深入学习,当然也可以与我继续探讨。

一直以来对Web前端开发兴趣颇深,用过一些框架产品。在JavaEye上看到一些刚接触前端开发朋友的疑问,犹豫这些产品的前景利弊,不知从何入手。想把自己的一点经验分享给大家,如有不到位之处请一起来纠正。

jQuery
1. 绝对的万金油,核心js只有50K,占用带宽小,门户网站、管理系统,用在哪都可以。
2. jQuery是对js底层dom操作封装最薄的一个框架,没有大量的专有对象,多为提供函数进行dom操作。准确的说,它不是偏重于富客户端的框架,而是侧重于对js dom编程。下面几种才是完整的富客户端的框架。
3. 我认为它最大的三个亮点,一是支持CSS3的大量选择符,想定位或选择一个html元素简直轻而易举。二是灵活便捷的Ajax请求和回调操作。三是事件绑定功能,内部封装了很多事件,想统一为一个页面上的一些元素添加事件很方便,这也提高了复用性和可维护性,避免了页面中出现大量的html属性。合理的编码可以使html与js, css分离开,便于维护。
4. 此外它也封装了很多常用的操作,例如节点的添加删除、常用的动画效果、逻辑判断比较等等。避免了直接使用dom api进行繁琐的操作。
5. 本身提供了可扩展的函数,可以自己编写插件与核心jQuery对象进行集成使用。这也是常用的手段,只要你理解js面向对象编程,熟悉jQuery API,就能写出很多定制的插件,复用在各种地方。
6. 至于jQueryUI,与其他框架不一样的地方在于,它很少用js去生成html,而是把现有的html通过jQueryUI的API加工成想要的效果,关于这点是好是坏,我觉得就是见仁见智的问题了,没有必要争论什么。
7. 新生的jQuery EasyUI不错。
8. 如果今后的更新都保持现在这种模式,我认为它的前景很乐观,什么时候javascript完蛋了才轮到它玩完。

ExtJS
1. 一整套带有UI的js库,封装得很多,很厚,核心js就600多K,这么大的东西门户网站当然就别想了,里面的效果当然也不会运用到门户网站,所以它是专门为管理系统而生的。因为局域网不会有带宽问题。
2. 它与jQuery不同,基本上是纯用js来生成html的,页面里只需引入各个ExtJS库和你自己写的js,不会出现很多html内容,body里基本没什么。所以优化就显得重要了,不然会严重浪费资源。
3. UI就不说了,大家都认可,本来就是为UI而生,它可以做出来桌面级程序的效果。一般来说,一个管理系统的项目如果用Ext,基本就从始至终都是Ext做了,不会像jQuery那样,哪想要了就加在哪,很随意。Ext更像一个整体(虽然它也可以拆开用,不过麻烦,不建议)。
4. 提供了对其他js框架的适配,像对jQuery, prototype等。没实际应用过,就不说了。
5. 理解js面向对象编程在ext中很重要,如果你觉得用jQuery时了解简单的dom和css即可,那你在这就吃大亏了,Ext处处离不开对象的概念。
6. Ext的UI开发类似C#,有很多控件。不同的是,你要全部自己手写,所以开发量较大。现在虽然有Ext Designer可视化工具,但其效果并不很好,生成的代码有的往往不是想要的,不易维护,真做起来还是自己写更方便。
7. 团队开发时,必须保证做UI的人每人都会Ext,而且深入应用过,因为Ext项目是整体,不适于参杂html替代。
8. Ext项目在IE系列浏览器上不可用,相当卡,我想这不是Ext本身的问题,所谓内存泄露等问题现在早已解决了,而且不是关键所在。我开很多网页同时用IE8看jQuery.net官网时有时也会卡,试想他们官网肯定做到很好的优化了吧,jQuery既是如此,何况Ext。反观其他浏览器,FireFox, Chrome等浏览Ext项目都很流畅,所以应该是浏览器对js解析不同造成的。
9. 版权问题,Ext运用在商业项目中是收费的。

Flex  [自己也是在学习中,不敢妄言,以后深入应用后再做补充]
1. Adobe平台的,基于ActionScript实现,用在哪都行,但偏重于内网管理系统,用在门户网站就相当于在线玩Flash游戏,loading...
2. 与Ext不同,它有健壮的可视化开发工具Flash Builder,可以同C#一样进行拖拽布局,生成一种xml,也便于维护。
3. 编译后生成swf文件直接嵌入html即可,提高安全性,浏览时同flash,需要flash player。
4. 与Ext相同,也是属于一个整体,有丰富的控件库。
5. 这条纯属个人观点,HTML5不支持插入对象,也就意味着不能插入swf文件,难道Flex就完蛋了?虽然HTML5不支持Flash是客观事实,但HTML5的统一为时尚远,各大浏览器对HTML5的支持,Adobe是否会有对策,这些会怎么样现在都不好说,HTML5与HTML4并行应该会有很长一段时间,至少Flex在现在是一个名列前茅的好产品,所以我选择了它。

SilverLight
微软平台的,主要是应用在微软系列的语言中,包括CS与BS架构。同样,除了jQuery,Asp.net也不适合与以上等框架集成,因为Asp.net是事件驱动,这些框架都是为消息驱动而生的,勉强应用只会事倍功半,丧失.net本身的优势。

js面向对象编程我一直在提,其实并不难理解,关于这点应该学习下,很有必要。它涉及到代码复用、功能扩展、对象继承、闭包、优化等很多问题,能省去不少编码,便于维护,还能不改变框架源代码而实现不同的功能。

希望能给刚走进前端开发的朋友一点帮助。
196
36
分享到:
评论
35 楼 zhouhaoqun_luntan 2011-04-15  
正在学习EXT当中
34 楼 yeuego 2011-03-19  
还是自己开发的JS好用多了,

按需加载,不会影响加载问题。
33 楼 wenxiang_tune 2010-12-04  
个人比较喜欢prototype,虽然大,但是可以提炼,代码风格很舒服。mootools不是prototype演变过来的吗? UI方面的提升做的不错,不过没用过,看过DEMO。。
EXTjs一般人不要轻易使用,真的,这玩意儿怎么说呢,界面还算不错,相应速度也蛮快的(我们公司的项目中使用过) 不过有个缺点就是学习曲线太高了
jquery是不错,不过我很厌烦的是很多人为了某一个单一功能就加入100多K的jquery进入,图方便,jquery的成就也成就了很多懒人。。。
32 楼 varyall 2010-11-16  
看了一下,还好
31 楼 Lanyef 2010-08-24  
    刚接触 Web ,看了文章以后,对这些有个大体的认识,还是比较及时。。
30 楼 chrisx 2010-07-05  
徐晶鑫 写道
题目应叫前端RIA技术 框架 css还有框架呢


技术是宏观概念,比如Ajax。这些都只是别人做出来的产品,所以叫框架或组件。
29 楼 徐晶鑫 2010-07-03  
题目应叫前端RIA技术 框架 css还有框架呢
28 楼 lkj107 2010-06-28  
html5太遥远

jquery现在还是应用最广泛的,简单

extjs商业化越来越重,而且js太大,one page,one application还是不好整的

Java的太多了,第一次加载太慢的问题一直是个老大难
27 楼 huangcs27 2010-06-28  
System.out.println("OK!")
26 楼 darkranger 2010-06-28  
jquery 有些了解, ext 还没了解过.....  不过现在了解了!~!
25 楼 未知异常 2010-06-28  
个人不推荐Flex。感觉玩玩还可以,要是做大项目,速度内存等性能绝对是问题。
24 楼 conanca 2010-06-28  
补充个:
google的GWT
23 楼 NGG 2010-06-27  
leepengyu 写道
NGG 写道
还有这些方案:
Apache Poivt 基于Java Applet
JavaFX
JSF
HTML5 (国外有人预计2022年才能成为标准)

个人觉得基于JS的方案都不是长久之计。WEB应用的基础是HTML,HTML设计之初没有考虑到现在的应用需求如此丰富,因此改变HTML本身才是最好的办法。

希望有一天HTML中直接包含Menu Tree Tab Grid这些组件...然后浏览器提供实现,而不是那些乱七八糟的插件。


JSF是基于事件驱动的MVC框架吧。。。不是web前端开发框架

JSF componnents grid 你看到过吗?
为何作者要把EXTJS ZK这些框架并列比较。
22 楼 chemzqm 2010-06-27  
我个人也比较看好Flex在中国的发展,Html5离我们太远,就算能用也需要一个向jquery这样的框架来封装那些难用的API;至于Ext,速度是一个问题,学习成本也是个问题
21 楼 chrisx 2010-06-26  
嗯 不过这篇日志就是针对于新朋友写的 只是初级的 以后有更深入的见解我也再发表 呵呵
20 楼 452mian 2010-06-26  
认识有些太浅,能深入点会更好
19 楼 chrisx 2010-06-25  
就像Struts等MVC框架一样,都是对MVC开发模式的一种规范和统一
18 楼 qamer 2010-06-25  
真无名 写道
支持NGG所说的
与其那么多框架搞来搞去,还不如html直接支持来得轻松,能为全世界编程人员省多少时间啊?

你可以这么想,html是个很泛很大的东西,因人不同而不同,软件讲究工程性,没有约束性就变的千奇百怪了,从而拖入维护的泥潭
17 楼 chrisx 2010-06-25  
真无名 写道
支持NGG所说的
与其那么多框架搞来搞去,还不如html直接支持来得轻松,能为全世界编程人员省多少时间啊?


没错,真有天下模式大一统那天的话,期待。但现在还是要多做好眼前的嘛,呵呵
16 楼 真无名 2010-06-25  
支持NGG所说的
与其那么多框架搞来搞去,还不如html直接支持来得轻松,能为全世界编程人员省多少时间啊?

相关推荐

    浅谈springMVC接收前端json数据的总结

    在讨论Spring MVC框架如何处理前端传递的JSON数据时,涉及到的知识点主要包括请求映射、数据绑定、数据类型转换、以及HTTP请求内容的编码方式等方面。 首先,需要了解的是Spring MVC如何通过@RequestMapping注解来...

    【ASP.NET编程知识】浅谈对Jquery+JSON+WebService的使用小结.docx

    【ASP.NET编程知识】浅谈对Jquery+JSON+WebService的使用小结 在现代Web开发中,ASP.NET结合jQuery和JSON以及WebService技术是构建动态交互界面的常见选择。jQuery作为一个强大的JavaScript库,以其简洁易用的API...

    浅谈javascript的调试

    最近比较吐槽,大家都知道,现在web前端相对几年前来说已经变得很重了,各种js框架,各种面对对象,而且项目多了,就会提取公共模块。  这些模块的UI展示都一样,不一样的就是后台逻辑,举个例子吧,我们做企业差旅...

    携程技术合集 2019.pdf

    文档中提到的“浅谈React数据流管理”可能涉及了React的状态管理和组件间数据传递的方法,如props、state、Redux或Context API等。 4. **业务团队发布流程**:携程拥有30+业务团队,其无线发布流程如何做到稳定高效...

    (完整版)Java系统架构师面试题 (2).docx

    24. 列举你做过的几个大型或超大型系统,而且描绘其特色; 架构师需要具备良好的系统设计能力和经验,能够成功地设计和实现大型系统。 25. 具备哪些能力?假如这个大型集成系统是车联网系统,那在系统剖析与架构...

    浅谈angularJs函数的使用方法(大小写转换,拷贝,扩充对象)

    在本文中,我们将深入探讨AngularJS框架中几个实用函数的使用方法。AngularJS作为一个非常流行的前端JavaScript框架,它提供了许多内置函数来简化开发过程。我们将重点介绍三个函数:大小写转换(angular.uppercase...

    activit

    至于压缩包中的文件名“浅谈activiti工作流_Html编程 - 好工具站长分享平台.mht”,这可能是一个包含HTML内容的MHT(单个文件网页)文档,很可能详细介绍了Activiti与HTML编程的结合,可能是关于如何在Web应用中集成...

    浅谈AjaxPro.dll,asp.net 前台js调用后台方法

    - **ExtJS**:一套完整的前端UI框架,内置强大的Ajax支持。 - **YUI**:Yahoo!开发的开源JavaScript库,包含Ajax组件。 - **Qooxdoo**:一个跨浏览器的JavaScript框架,提供强大的Ajax和UI工具。 - **DWR (Direct ...

    浅谈AngularJS中$http服务的简单用法

    AngularJS是Google开发的一个非常流行的前端JavaScript框架,它为开发者提供了众多的内置服务来简化与后端的交互。其中之一就是$http服务,它封装了原生的XMLHttpRequest对象,使得开发者能以更简洁、高效的方式执行...

    浅谈layui里的上传控件问题

    layui 是一个轻量级的前端框架,它提供了一系列丰富的组件,包括我们在这里讨论的上传控件。layui 的上传控件使得在网页上实现文件上传变得简单而高效,它支持多种功能,如多文件选择、文件预览、上传进度显示等。 ...

    浅谈AngularJS中ng-class的使用方法

    AngularJS 是一个非常流行的前端框架,由 Google 团队开发,其目的是为了帮助开发人员使用模型-视图-控制器(MVC)模式来构建动态Web应用。在AngularJS中,ng-class 是一个指令,它可以动态地添加或移除HTML元素的...

    浅谈bootstrap源码分析之tab(选项卡)

    Bootstrap是一款流行的前端框架,用于构建响应式布局和移动设备优先的Web项目。在Bootstrap中,Tab组件是一个常用的功能,用于创建选项卡式界面,让用户能够方便地在不同的内容区域之间切换。本文将深入探讨...

    浅谈SpringMVC jsp前台获取参数的方式 EL表达式

    在开发Web应用程序时,SpringMVC框架常被用于处理后端逻辑,而JSP(JavaServer Pages)则负责前端展示。在前后端交互的过程中,传递参数是必不可少的环节。本文将探讨SpringMVC中如何通过EL(Expression Language)...

    基于java的会议室预约系统的设计与实现-开题报告.docx

    系统的研究方法主要通过对当今互联网的发展方式进行调查、统计和分析,明确网上会议室预约系统对于现代企业办公资源管理的方式影响,同时考虑到了未来几年的发展需求,设计了一个界面美观,公共能完善,满足用户需求...

Global site tag (gtag.js) - Google Analytics