[Web UI]对比Angular/jQueryUI/Extjs:没有一个框架是万能的
Angular不能做什么?对比Angular/jQueryUI/Extjs
框架就好比兵器,你得明白你手里拿的是屠龙刀还是倚天剑,刀法主要是砍,剑法主要是刺。对于那些职业喷子和脑残粉,小僧送你们两个字:呵呵;同时祝你幸福,请点右上角。
首先要明白Angular不能做什么,或者Angular没有提供什么,然后再来看它能做什么,来看Angular与其它一些主流框架的对比。

对于上面的表格,有人可能要跟我抬杠,咱大jQuery不是有各种插件吗!不是有各种EasyUI、LigerUI等等一大堆UI吗!
我只想说,你特么到底有没有做过大型的开发?各种东西倒腾在一起的组装货能比得上品牌机?另外遇到jQuery版本不兼容就够你喝一壶了吧!说jQueryUI各种乱已经是对它客气了,实际上是一塌糊涂!
提醒某些小白区分好概念,小僧的喷点是jQueryUI,而不是jQuery,jQuery这把小巧玲珑的瑞士军刀小僧还是非常喜欢滴!另外,也有 一批基于jQuery的UI套件做得非常优秀,比如KendoUI,但是一分钱一分货,好东西基本上都是收费的。这么多年下来了,你应该早就习惯了这条行 规。再说一次,好!东!西!都!是!收!费!的!
又有人说,怎么没把bootstrap列在里面对比一下?请问油漆桶和Tank战车怎么比?你比给我看看。
关于前端UI体系的特别说明
对于前端UI系统,特别说明一下。一般来说,前端UI必须包含以下控件和工具(参照了我最熟悉的Extjs):
Form
TextField
NumberField
PassWord
ComboBox
CheckBox
Radio
DatePicker/TimePicker(日期和时间控件一般没有人会自己去写,太复杂了!)
表单验证:本地验证和远程验证
DataGrid
复杂表头、数据格式、行内各种格式、动态编辑、分页、动态列、滚动(等等)
完善的数据表格也是一个非常复杂的控件,完全自己开发不容易!
Tree
Window
模态/非模态
Panel
TabPanel
tab懒加载(内存释放和浏览器兼容性比较繁琐,做完善不容易!)
HTMLEditor
应该没有哪个疯子想自己去做一个类似KindEditor那样在线编辑器吧!什么?你想做?药不能停!
小组件
ToolTip
Slider
Pager
ProgressBar
Menu
Label
Image
Alert
布局
布局系统是比较复杂的,必须有深厚的CSS基础,否则搞出来的东西一定有兼容性问题!好吧,我知道有人肯定要说bootstrap了,既然都在说那么小僧就不说了,自己玩儿去!
其它工具
Ajax
模板
数据格式化
其它各种控件就不说了,比如幻灯片效果、面包屑,再比如“×款超棒的jQuery××”等等。
Angular没有提供完善的UI,没有提供CSS样式套件,也没有对移动平台进行直接支持。所以,如果你使用Angular,你一定需要其它东西来配合。例如,如果需要UI,你需要使用jQueryUI,或者自己封装UI组件;如果需要CSS样式,你可以选择bootstrap或者LESS;如果需要支持移动平台,还是需要你自己 去开发。
好了,看到这里有人开始嘀咕了,这特么岂不是什么都没有嘛!!!
莫急,再来看Angular有什么。
Angular能做什么?
1、自动化的数据双向绑定;
2、MVC;
3、依赖注入---DI系统;
4、指令系统(可以自定义语义化标签)---Directive机制;
5、模块化---Module机制;
6、路由机制---Route机制;
7、服务---Service机制;
8、内嵌表达式---Expression机制;
9、前端代码单元测试和集成测试的自动化(借助于Yeoman等工具);
10、模板;
11、动态加载;
这么多机制里面,核心的核心是指令系统,实际上其它所有特性都是建立在指令系统之上的。本质上说,Angular写了一个JS版的编译器,一切都构 建在这款编译器之上。对于使用者来说,可以把解析器看成一个JS虚拟机,有兴趣的人可以自己阅读Angular的Parser(HTML解析器)源码。
HTML解析器机制是其它所有框架所不具备也不敢这样做的,它是Angular的灵魂。
结论
很显然,Angular并没有打算做一个高大全的所谓【框架】,它的核心价值在于,把一堆后台框架的概念带到了前端框架中,比如依 赖注入(来自Spring);同时又从其它地方抄了一些概念,比如数据自动双向绑定(貌似来自Flex)、模板、MVC、动态加载(来自 RequireJS等),等等。当然,这些理念都挺好。基于这些理念和工具,你可以把前端应用组织得非常良好。
但是,有一点请特别注意(尤其那些负责技术选型的所谓“架构尸”,请瞪大你的钛合金狗眼看好下面的内容):对于界面非常复杂的业务 型系统,必须要要有完备的UI支持(Form、DataGrid、Tree、Tab、Window等)。如果你的团队整体JS水平很烂,或者压根没打算自 己去做很多东西,请慎用AngularJS!尤其是那些只有两三条破枪,连美工都没有的小公司,您请靠边儿凉快,这儿没您什么事儿。
最后的最后
没有一款框架能做所有事情,因为从来就 没!有!银!弹!(提醒小白,这个词出自《人月神话》)
对于那种幻想用一种框架(包括付费购买的)就能解决所有问题的小屁孩,扔给他一根棒棒糖吧!
其它相关内容:
1、OReilly的《AngularJS》已由电子工业出版社出版
http://damoqiongqiu.iteye.com/blog/1965167
2、《AngularJS》5个实例详解Directive(指令)机制
http://damoqiongqiu.iteye.com/blog/1917971
3、AngularJS表单基础
http://damoqiongqiu.iteye.com/blog/1920191
4、AngularJS Form 进阶:远程校验和自定义输入项
http://damoqiongqiu.iteye.com/blog/1920993
5、AngularJS:在Windows上安装Yeoman
http://damoqiongqiu.iteye.com/blog/1885371
6、使用JsTestDriver实现JavaScript单元测试
http://damoqiongqiu.iteye.com/blog/1924415
[Web UI]对比Angular/jQueryUI/Extjs:没有一个框架是万能的的更多相关文章
- 转载:对比Angular/jQueryUI/Extjs:没有一个框架是万能的
Angular不能做什么?对比Angular/jQueryUI/Extjs 框架就好比兵器,你得明白你手里拿的是屠龙刀还是倚天剑,刀法主要是砍,剑法主要是刺.对于那些职业喷子和脑残粉,小僧送你们两个字 ...
- 对比AngularJS/jQueryUI/Extjs:没有一个框架是万能的
AngularJS不能做什么?对比Angular/JSjQueryUI/Extjs 框架就好比兵器,你得明白你手里拿的是屠龙刀还是倚天剑,刀法主要是砍,剑法主要是刺.对于那些职业喷子和脑残粉,小僧送你 ...
- Web UI 技术发展历程
本文内容 纯文本和静态 HTML 页面 服务器端技术 插件技术--ActiveX.Applet 和 Flash Ajax 异步时代和基于 JavaScript 的 UI 技术 RIA--Adobe F ...
- SAP 登录Fiori的user和登录WEB UI的business role之间的关系。
SAP 登录FIORI的user 会被assign 一些控制前端app显示的business role(是一些PFCG role的集合),该business role和登录web ui选择的S4C_S ...
- atitit.React 优缺点 相比angular react是最靠谱的web ui组件化方案了
atitit.React 优缺点 相比angular react是最靠谱的web ui组件化方案了 1. React的组件化才是web ui部件的正确方向1 1.1. 组件化集成html ,css ...
- Kendo Web UI Grid添加一个html控件如(checkbox,button)
在Kendo Web UI Grid增加一个控件如效果图: <div id="grid1"></div><script> $("#gr ...
- python3+Robot Framework+PyCharm第一个WEB UI自动化用例
这里只是列举一个很简单的例子,简单介绍工具的使用,编写用例之前,做好WEB UI自动化的准备工作,下载好chrome驱动(这里以chrome为例,不同浏览器有对应的驱动),注意驱动和浏览器版本要对应, ...
- 错误 103 未能加载文件或程序集“Telerik.Web.UI”或它的某一个依赖项。磁盘空间不足。 (异常来自 HRESULT:0x80070070)
运行vs2010时出现错误: 错误 103 未能加载文件或程序集“Telerik.Web.UI”或它的某一个依赖项.磁盘空间不足. (异常来自 HRESULT:0x80070070) 处理方式:清理C ...
- 查看 page页面某一个属性在 web ui 中的位置。
1:例如查询 description 属性在web ui 中的位置. 2:进入订单编辑状态,鼠标放到该字段上,按F2 3:出现该字段的详细信息,包括:component,contextNode 4: ...
随机推荐
- ruby中的方法查找
ruby中的方法调用都是 对象.方法 的形式,那么对象如何找到这个方法呢? 首先必须了解祖先链的概念,祖先链就是从一个类开始,到它的父类,再到父类的父类...一直到最终的起点(ruby中是BasicO ...
- Bridge Serial-Ports over network
https://stackoverflow.com/questions/29207980/bridge-serial-ports-over-network For an application, wh ...
- Gym - 101875I I Will Go (dfs序)
题意:N个人要参加一个局,每个人有自己的好朋友,如果他的好朋友来,他才有可能来.N个人的关系不够成环.Q次查询,问若x来了,y是否肯定来. 分析:若点y是x的祖先,则y肯定回来.一次dfs确定每个点覆 ...
- cocos2dx 3.x 精灵重叠时点击最上层的精灵
ps. 这个方法只适用设置精灵的触摸.. //注册触摸事件..3.X后可以在这样写..不需要重新声明 EventListenerTouchOneByOne *listener = EventListe ...
- 多线程中sleep和wait的区别,以及多线程的实现方式及原因,定时器--Timer
1. Java中sleep和wait的区别 ① 这两个方法来自不同的类分别是,sleep来自Thread类,和wait来自Object类. sleep是Thread的静态类方法,谁调用的谁去睡觉,即 ...
- 高通camera结构(摄像头基础介绍)
摄像头基础介绍 一.摄像头结构和工作原理. 拍摄景物通过镜头,将生成的光学图像投射到传感器上,然后光学图像被转换成电信号,电信号再经过模数转换变为数字信号,数字信号经过DSP加工处理,再被送到电脑中进 ...
- js对数值型数组排序错误
今天对一个js的数值数组排序,结果发现好像排后的像是对字符数组排的序,后来一查才发现 a = [33,1000]; a.sort(); 结果:1000 33 无论类型,sort方法会调用每个数组项的t ...
- 一键安装lnmp-php(5)
php(){cd $pathtar zxvf yasm-1.3.0.tar.gz cd yasm-1.3.0.tar.gz ./configuremakemake installcd $pathtar ...
- nginx配置Strict Transport Security
一个网站接受一个HTTP的请求,然后跳转到HTTPS,用户可能在开始跳转前,通过没有加密的方式和服务器对话,比如,用户输入http://zt.test.com或者直接zt.test.com.这样存在中 ...
- The OAuth 2.0 Authorization Framework: Bearer Token Usage
https://tools.ietf.org/html/rfc6750 1.2. Terminology Bearer Token A security token with the property ...