争挑选适合的前端框架(去何方网前端架构师司徒正美)

转自:http://www.iteye.com/news/30547

前端框架不断推新,众多IT企业都面临着“如何抉择框架”,“是否用再造轮子”的选取。去何方网前端架构师司徒正美分析了每主流行框架优劣点、适用场景,并对准不同范畴的公司、项目被起了对应的前端技术选择方案。

近期几年,前端技术迅猛发展,差不多每年还见面冒充出同放缓主流的框架。
每次新开业务线或启动新路时,首先第一宗事就是纠结:使用什么框架,重造什么轮子?我特别欢乐应CSDN的邀请称自己的观点。

RequireJS,前端技术提高分水岭

以五六年前,移动端还不曾起来,我们从没什么选择,就是jQuery。有人会说,jQuery只是类库,不是框架;但当时前端业务还尚无如今天如此繁重,原本是后端干的事,全部平移到前端来,因为光是jQuery就足以确保打天下。jQuery不敷用,还有为数不少的jQuery的插件呢。于是问题即使是这般挨家挨户衍生出了,一个页面太多jQuery插件了,请求数最好多矣,于是我们得打包。打包需要我们本着插件有宏图。于是当即等同求在社区上逐渐形成了几许
规则,其中最为出名的是AMD规范,体现上RequireJS这个加载库上。

RequireJS是前者技术进步上的一个丘陵。JavaScript于ES6之前一直尚未和谐之加载机制,RequireJS的出现表示前端可以向更充分局面发展。以后本人说的技艺选型,一个那个重大之甄选点,
即是否留存加载器机制还是切某个模块规范。

选择前者框架应综合考虑框架本身和团伙情况

返回原的话题,选择框架而打个别冲看,一凡看该框架的本领,二是圈你们团队的身手。

打框架的角度来拘禁,
它的功能丰富不增长、社区活跃度如何、国内社区活跃度如何(有的在海外流行,但国内只有初创公司还是局部特别商家的边缘项目以试水)、文档齐全与否、是否就
更新、测试覆盖率如何、上手难易度如何,都是咱考量点。不过能上我们视野内的异邦框架,基本是身经百战,在前往轮子兴盛的世界闯出来的领头羊。
jQuery、Angular、KnockOut、Emberjs、Polymer、React、Backbone、Zepto,我们基本是环绕于当下几个
上面转了。当然还有复大型的事物,如EXT、
YUI、Dojo、EasyUI、Bootstrap,这是UI库层面的。

脚是2012年外对立即盛行12单JavasScript MVC框架的纯技术评估:

图片 1

大庭广众,我们首先步就是是选用时下最盛行的框架和库用作评估对象,然后又冲我企业之图景展开筛。贵公司是建站公司,还是生自己活之店家呢?如果是建站公司,页面不见面复杂到乌去,基本上jQuery+Bootstrap搞定,不要想得最好多,就是她。只要起和好活,
要保障一格外堆客户数,要同客户打交道,不难想象存在非常复杂的CRM系统,按照中国人数的风味,这东西就会更复杂,这将慎重考虑了
。这频繁是持续十年之护卫升级,我们得看一下某某框架是否发生你们的成品那么长寿,这框架的升官创新是否频繁和。

老工承诺尽量避开谷歌产品

若您的类型是一个跨度三年以上的百般工程,用《人月神话》的术语来说,90%便是独焦油坑。我们用采取重复稳健成熟之技巧方案,我们需要重点避开谷歌的制品,它的大队人马出品都是玩票性质,GWT、Closure、Darty就是前车之鉴。Polymer冲许多初技巧构建,其中Object.observe()、
Custom Elements、HTML Imports、Shadow DOM、Model-Driven
Views还远没被准,
许多或者个别的,变数太非常,因此才面世下图所展示之悲剧。
Angular不是我黑它,这东西吧喜爱断崖式升级,它以1.08常兼容IE6-8,1.2常要打补丁兼容旧式IE,1.3丢掉了对旧式IE的相当,直
接在源码中删除了独具兼容代码,因此具有补丁方案都没法儿,并且不支持全局Ctrl函数,许多模块需要独自引用,1.4休向下支持动画模块,2.0出于
at改成为ts构建,由于采取Object.observe(),因此无支持IE6-11,Chrome30……

图片 2

后台系统而考虑EXT、EasyUI,avalon等国内优秀框架为值得考虑

只要你们的活是后台系统,那么就算来点儿单挑选,使用EXT、EasyUI这些重点的UI库方案,其中EXT具有严重的排它性,它充分为难及其它前端解决方案并用。什么模块组织、打包、数据可视化,它都曾经能一体拉扯你搞定。它文档齐备漂亮,入门难度中等,但它们要求你的集团十分稳定,现在导致一个专职EXT
的前端是可怜为难之。EasyUI是国内比较充分牌子的UI框架,虽然闭源,不过想扩大其不是难事。

此外,国内的淘宝Kissy,
网易Nej也对。还有更轻量的方案:MVVM。MVVM最拿手做这些重交互的产品。举例说,为了对诺复杂交互的Gird,jQuery社区开发出各种高大巨物DataGrid、jqGrid、FlexiGrid,还未若MVVM几只巡回绑定来得干脆利落,扩展性又吓。目前,KnockOut、
Emberjs、Angular与自写的avalon就是立等同像样框架。Angular虽然有点坑,但若是您是打1.3因此自,并且不鸟IE,它还是一个不易的精选,其活跃的社区也它带动最的或是。KnockOut在.Net人群被深流行,微软出品,前端MVVM框架的始祖,不过其用对后端数据开展了多之加工,因为它自己是未支持对套嵌对象的绑定。Emberjs没有一个吓干爹,但生一个吓亲爹,作者Yehuda
Katz是jQuery,
Rails、SprouteCore、Merb、Handlebars这些名牌框架的核心成员,虎父无犬子,Emberjs现在或者国外的次大MVVM
框架。avalon是较吻合国情的MVVM,有它们特别兼容IE6的版,易达成亲手,性能大,视频教程多,出了问题可以抓得正作者,是其的几乎好卖点。

重SEO产品,可考虑jQuery+Bootstrap+RequireJS组合

假设你们的制品是市这样重演示类的活,就本着SEO有要求,MVVM就不相符了。目前啊不怕Angular与avalon在闹后端渲染机制,但还未齐了台面。这时jQuery+Bootstrap+RequireJS就那个好用。RequireJS的意图不单单是提供了一个仍需加载机制,它还会叫咱们团队于进一步庞大之代码。如果未用RequireJS,国内其它一个摘取是SeaJS,它的正经是CMD。此外还有CommonJS规范,但当时无法直接运行于前者,需要借助fekit、FIS、Webpack这样的构建工具进行合并了。不管怎么说,你这选用的框架必须有AMD、CMD或
CommonJS任一栽加载规范,这有利于而下的横向扩张。至于插件,目前多少插件等都趋于用UMD,它可让AMD、CMD、CommonJS任一种植加载
器加载。

运动端技术于混乱,需多任齐下

万一你们的成品是移动端,基本上是SPA架构了,因为马上会减小等候,整页刷新和请求数。目前该领域十分混乱,不同为PC端,要配合的浏览器多发生N
倍,并且以性,浏览器商乱砍功能要改动部分浏览器特性的行,往往引发部分想不到之BUG,目前社区正在整理这些坑和解药。但眼下莫一个框架能够战胜所有问题,都需多任齐下。我之见解是:

RequireJS(按需加载,移动端上可以免自包,善用304缓存,腾讯搞来一个又牛叉的增量更新加载器MT,也可以尝试)+Backbone(组织代码和程由于管理)+Zepto(轻量DOM操作)
+
fastclick.js(点击过外露和延迟处理)+Hammer.js(各种触屏事件)+iScroll5.js(滚动条处
理)+Animate.css(CSS3动画)+Enquire.js(处理响应式布局)。

足见移动端每个部件还烂到蕊了,每个部件还亟需特地的家伙进行修补。移动端是好强调体验的,每一个有些角落还设有着各种卡通,但浏览器还是自带的
WebView都颇差劲,于是Native与Hybird的话题才一直这样火。有的人说,既然DOM最吃性,那么即使索性用Canvas来代表吧(请
见:http://zhuanlan.zhihu.com/FrontendMagazine/19967854
与http://www.ruanyifeng.com/blog/2015/02/future-of-dom.html
)。Facebook也出了好相仿之方案React
Native,自己实现了同仿照GUI,不过编写语言是JavaScript。它是运自己原来的超高性能轮子React实现之。这要么是平等长达道路。但优缺点也明朗,正如Angular浓浓的Java风,React是在逻辑中插大段标签语言(JSX)。同时React的排它性也殊高,很麻烦跟另库搭配使
用。同时,我们好观看,出自jQuery名门的jQuery
Mobile并从未入围,那个性能最好浅了,连Sencha
Touch也不如。上面说的只是骨干库, 还并未搬起UI库呢。号称Mobile
First的UI库不在少数,由于无视IE,可以大胆运用CSS3。目前可比不错的发生Foundation、Semantic,Refill、
Ratchet。如果只是怀念运行于机械上,性能问题就是不见面那么紧了,我们尚好试行inoic、Sencha
Touch, Kendo UI Mobile……

靡太好,选择最为可自己之

多,针对每个平台,我都列出一些主流框架,但未意味你们还能够开得下马。小马过马,老牛没了膝盖,松鼠淹个半死,就是这么回事。创业公司爱新框架,这跟她们将得由高薪招一两单前端牛人所赋,基本上所有页面就是他们涉嫌的,因此用Angular或Ember都无分别。小公司则小心,人员流失
大,jQuery+RequireJS是万金油。大店虽然多起友好的技艺沉淀,换言之,应该发和好之前端框架,除非那东西非常旧,不建议再造轮子。对好商厦之提议是作自己的技巧委员会,根据自己之口配置来摘取的框架。有句话说得好,不请最好好,但请最好确切。有些框架就属于牛逼人手里牛逼闪闪,二压人手里一团乱麻。对于一些成长特别快之中游公司吧,这点最需要提防,牛人是一些,但征战的基本点70%还是刚刚培训出来的实习生,难上亲手,中文文档不全的框架就自然
须过滤掉。我啊未消除之轮子的可能性,毕竟有点公司就是大有人在,能产部分因谱的开源产品来便于社区。

但是无论是我们捎什么框架或决定好动手造轮子,都非忘初心,技术必须给咱们办事在更是轻松愉快——我们才选我们能够驾驭住的框架,我们不克保证她于同年晚是否会面过时落后,但至少不会见变成绊脚石。套用亚当·斯密的说话(税收是如出一辙栽必需的厌烦)来说,框架是均等种植必需的头痛,它是强约束的,因此要慎重选择。

相关文章