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

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

希望能给刚走进前端开发的朋友一点帮助。

浅谈我对几个Web前端开发框架的比较的更多相关文章

  1. 【转】浅谈常用的几种web攻击方式

    浅谈常用的几种web攻击方式 一.Dos攻击(Denial of Service attack) 是一种针对服务器的能够让服务器呈现静止状态的攻击方式.有时候也加服务停止攻击或拒绝服务攻击.其原理就是 ...

  2. Bootstrap非常简单实用的web前端开发框架

    今天无意间用firebug看网站的代码发现了Bootstrap,之前从来没有听说过这个东东,于是对它产生了好奇感,通过百度我了解到了Bootstrap是一款非常简单,强悍,实用,移动设备端优先使用的这 ...

  3. 腾讯Web前端开发框架JX(Javascript eXtension tools)

    转自:Web前端开发-Web前端工程师 » 腾讯Web前端开发框架JX(Javascript eXtension tools) JX – Javascript eXtension tools 一个类似 ...

  4. 浅谈HTTP缓存以及后端,前端如何具体实现HTTP缓存

    <浅谈HTPP缓存>原版: https://juejin.im/post/5bdeabbbe51d4505466cd741?utm_source=gold_browser_extensio ...

  5. 浅谈_IDEA导入Eclipse的Web项目

    相信很多同学在工作中都会遇到将一个Eclipse的Web项目导入IDEA的情景,这里浅谈一下具体的操作流程 一:Import Project,选择要导入的项目 二:选择以Eclipse模型的方式导入 ...

  6. 优秀的WEB前端开发框架:Bootstrap!

    其实早就对Bootstrap有所耳闻,大概了解这哥们是做WEB前端的 但直到昨天以前,还没有对他产生任何深入了解的兴趣 冷落他的主要原因还是觉得会束缚手脚,毕竟自己多年来在WEB前端的积累一直没有停滞 ...

  7. Web前端开发框架大全-详述

    可以说,前端技术的发展是互联网自身发展的一个缩影! 前端技术的发展经历了web1.0时代,即网页只能展示信息,几乎没有交互可言: web2.0时代,web2.0不再是单维的,逐渐发展为双向交流,另一特 ...

  8. 前端修仙之路---一、如何用gulp搭建一套web前端开发框架

    引言 相信从事web前端开发的朋友都知道,现在流行的Vue.AngularJS等框架中,它们都有独立的脚手架来创建项目,比如Vue有vue-cli,Angular有angula-cli.脚手架可以一键 ...

  9. 浅谈Bootstrap自适应功能在Web开发中的应用

    随着移动端市场的强势崛起,web的开发也变得愈发复杂,对于个体开发者来说,自己开发的网站,在电脑.手机.Pad等上面都要有正常的显示以及良好的用户体验.如果每次都要自己去调整网页去匹配各个不同的客户端 ...

随机推荐

  1. SQL开发中容易忽视的一些小地方(五)

    原文:SQL开发中容易忽视的一些小地方(五) 背景: 索引分类:众所周知,索引分为聚集索引和非聚集索引. 索引优点:加速数据查询. 问题:然而我们真的清楚索引的应用吗?你写的查询语句是否能充分应用上索 ...

  2. Spring 5 (0) - Introduction & Index

    Spring Framework Reference Documentation I. Overview of Spring Framework . Getting Started with Spri ...

  3. OpenWRT GPIO人口控制 WLED

    Linux根据系统GPIO系统架构简介 关于这个GPIO我一直认为非常非常长的时间easy.但.当你需要给一个特定的系统,参与这些GPIO什么时候.你会找到.不对,实例,mt7620n. GPIO#7 ...

  4. vs2010中文简体版下载链接(含中文msdn)

    昨天朋友说vs2010中文版能够下载了,自己開始还不相信,正好周末,于是就下载了试一下 安装了果然是中文版,本来是msdn订阅用户才干够下载的,感谢上传的网友. 文件名称 cn_visual_stud ...

  5. eclipse环境下如何配置tomcat

    eclipse环境下如何配置tomcat 很多初学,尤其自学JavaWeb的朋友首次在eclipse下配置tomcat时,总会有种难下手的感觉,在此,通过图文解说的方法,最直观的向大家演示一遍该配置过 ...

  6. java缓存技术(转)

    最近在做java缓存,了解了一下.以下仅是对map对方式讨论.没有对点阵图阵讨论.作缓存要做以下2点: 1:清理及更新缓存时机的处理:   . 虚拟机内存不足,清理缓存   .. 缓存时间超时,或访问 ...

  7. Java Web整合开发(4) -- JSP

    JSP脚本中的9个内置对象: application:    javax.servlet.ServletContext config:          javax.servlet.ServletCo ...

  8. java nio的一个严重BUG(转)

    这个BUG会在linux上导致cpu 100%,使得nio server/client不可用,具体的详情可以看这里http://bugs.sun.com/bugdatabase/view_bug.do ...

  9. 大数据系列修炼-Scala课程08

    接下来会讲解关于各种模式匹配,从中就会知道模式匹配的重要性 关于Type.Array.List.Tuple模式解析 1.Type模式匹配代码解析 //关于Type类型的模式匹配 //匹配 Int类型. ...

  10. xml:Invalid byte 2 of 2-byte UTF-8 sequence

    xml解析错误:Invalid byte 2 of 2-byte UTF-8 sequence 在做接口解析时候出现的错误:Invalid byte 2 of 2-byte UTF-8 sequenc ...