报名参加CloudWeGo黑客松,奖金直推双丰收! 了解详情
写点什么

前端开发框架选型清单

  • 2014-05-10
  • 本文字数:2491 字

    阅读完需:约 8 分钟

随着 Web 技术的不断发展,前端开发框架层出不穷,各有千秋,开发者在做技术选型时总是要费一番脑筋,最近,IBM 高级工程师王芳侠撰文对 Bootstrap、jQuery UI、jQuery Mobile、Sencha ExtJS、Sencha Touch、Sencha GXT、Dojo、Dojo Mobile、Mootools、Foundation、YUI、Kissy、QWrap 等 16 个国内外前端开发框架进行了比较详细的比较,非常值得读者借鉴。

从国外的桌面端框架来说,作者认为主要有以下几个:

  • Bootstrap 主要针对桌面端市场,Bootstrap3 提出移动优先,不过目前桌面端依然还是 Bootstrap 的主要目标市场。Bootstrap 主要基于 jQuery 进行 JavaScript 处理,支持 LESS 来做 CSS 的扩展。如果想要在 Bootstrap 框架中使用 Sass,则需要通过 Bootstrap-Sass 项目增加兼容。Bootstrap 框架在布局、版式、控件、特效方面都非常让人满意,都预置了丰富的效果,极大方便了用户开发。在风格设置方面,还需要用户在下载时手动设置,可配置粒度非常细,相应也比较繁琐,不太直观,需要对 Bootstrap 非常熟悉配置起来才能得心应手。
  • jQuery UI 是 jQuery 项目组中对桌面端的扩展,包括了丰富的控件和特效,与 jQuery 无缝兼容。同时,jQuery UI 中预置了多种风格供用户选择,避免了千篇一律。如果您对预置的风格不满意,还可以通过 jQuery UI 的可视化界面,自助对 jQuery UI 的显示效果进行配置,非常方便,够高端大气上档次。
  • Sencha Ext JS 是 Sencha 基于 Ext JS 开发的前端框架,内容极其丰富,控件、特效等支持非常非常丰富,表格、图画、报告、布局、甚至数据连接,无所不包。只有您想不到,没有它办不到。基于 Sass 和 Compass,使得用户对格式的修改和特效制作更加方便。商业化是 Sencha 的另一把利剑。帮助 Sencha 披荆斩棘之时,也把大把的码农砍在马下。Sencha 规定,凡是商业化的应用,都需要付费。另外,Sencha 的辅助产品也全部收费,否则只能是试用版。
  • Dojo ,目前唯一能与 Sencha Ext JS 一较高下的框架就只有 Dojo 了。抱着 IBM、VMWare 等众多大腿,Dojo 的一颦一笑都额外惹人注目。Dojo 项目的产品线和功能也特别丰富。首先,Dojo 有自己的 DOM 解析器 Nano,是 DOM 解析和处理的内核。此外,Dojo 的 Web 框架有非常丰富的布局、版式、控件以及特效,对多语言以及图表的扩展支持都非常好,并支持对地图的操作。大家可以查看它的演示,与 Ext JS 的效果进行比较。此外,Dojo 还有自己的图形化设计和开发工具 Maqetta,可以通过拖拽实现设计。Dojo 的风格设置不是在下载的时候指定的,而是通过引用不同的 CSS 格式来实现。
  • Mootools 可以说是目前最轻量级的前端框架,内核 js 压缩完之后只有 8k,完整版压缩之后也不到 100k,远比其他框架要小很多。Mootools 有自己的面向对象设计的内核 Mootools Core。伴随着最小的文件大小,框架的功能比其他框架也要弱不少,只有在控件和特效上有少量支持。
  • Prototype JS 也是一个简洁的框架,有着丰富的对 DOM 操作的功能,对 Ajax 和 JSON 支持得都非常好,在使用上与 jQuery 相比也相差不多。作为 Rails 默认的 JavaScript 框架,相信对广大开发人员也很有借鉴意义的。
  • YUI 作为开源前端框架的鼻祖,在框架上的功力非常之深。有着自己的解析 DOM 的核心框架,并且在特效、动画、图表等方面都有丰富的扩展,并可以通过 YQL 直接访问 Yahoo!的数据。在用户经常使用的功能方面都有着不错的表现。与 jQuery 灵活的语法相比,YUI 显得更加中规中矩,在代码组织、结构和模式方面都更加讲究,更体现出工程师的严谨。

对于国内的前端开发框架,作者也做了分析:

  • Kissy 是阿里集团自主开发的前端框架,目前在淘宝网、一淘网等阿里系网站上得到不少应用。Kissy 框架模仿 jQuery 编写了自己的内核 Kissy Core,用于对 DOM 的解析,Ajax 处理等。同时,有着丰富的控件,并实现了一些动画效果和特效。同样,在 Kissy 的控件中也可以看到 Bootstrap 等国外框架的影子。此外,Kissy abc 项目工具可以帮助用户实现自动化构建,并有很多扩展组件方便用户使用。
  • Qwrap 是百度有啊团队推出的 JavaScript 框架,现在被收入 360,被广泛应用与 360 产品中。Qwrap 综合 jQuery、Prototype、YUI 特点,对 JavaScript 进行了封装。但是,如果要把 Qwrap 算成一个前端开发框架还是有些牵强,因为除了 JavaScript 类库之外,Qwrap 基本乏善可陈,还处于发展阶段。
  • Tangram 是百度推出的另一个 JavaScript 框架,被广泛应用于百度系旗下的产品,与 Qwrap 类似,Tangram 也只能算是一个 JavaScript 框架,对 JavaScript 做了不少扩展,但是作为前端开发框架还是显得比较单薄。基于此,百度公司继续推出了两个基于 Tangram 的项目,Magic 和 Baidu Template。

对于桌面端,作者给出了技术选型的建议:

目前 Bootstrap 和 jQuery UI 已经可以满足大多数的开发需求,也在业界得到了广泛的应用,有着丰富的组件和扩展,以及相对简洁的语法和操作。应对我们的基本需求已经足够了。如果您对前端界面的效果有比较高的要求,希望可以应用像结构树这样比较复杂的控件,建议您考虑 Dojo,抱了这多年的大腿也不是白抱的,效果还是很不错的。对于,局域网的应用,还可以考虑 Sencha Ext JS 框架,效果更加震撼,但是对网络的要求也更高。如果这些还是不能满足您内心的狂野,那只能建议您使用 Flex 或者 SilverLight 了。相反,如果您对网络速度非常敏感,希望找一个迷您并且功能不错的框架,那 Mootools 会是您不错的选择。如果您很怀旧,也可以使用 YUI,虽然曲线不够性感,但是内容很丰富。如果您是一个 Ruby on Rails 的开发人员,建议您可以先看一下 Prototype 框架,毕竟是默认的框架。如果您对上面说到的框架都不满意,那建议您体验一下国内的框架一段时间,然后再回过头来看刚才说到的框架,相信您一定会有一种豁然开朗的感觉。

除此之外,作者还对移动端的开发框架做了介绍,并提出了自己的选型分析,具体的内容,读者可以查看其原文。InfoQ 读者对于前端开发框架的选型有何心得,欢迎发表自己的看法。

作者的微信公众号“老崔瞎编”,关注 IT 趋势,承载前沿、深入、有温度的内容。感兴趣的读者可以搜索 ID:laocuixiabian,或者扫描下方二维码加关注。

2014-05-10 08:1923517
用户头像

发布了 501 篇内容, 共 264.9 次阅读, 收获喜欢 61 次。

关注

评论 1 条评论

发布
用户头像
时代变化的真快!
2020-04-29 17:46
回复
没有更多了
发现更多内容

Android-Camera内存问题剖析,通用流行框架大全

android 程序员 移动开发

android开发入门与实战网盘,安卓面试宝典

android 程序员 移动开发

androidframework开发教程,安卓面试题库

android 程序员 移动开发

androidstudio连接手机,四面阿里Android开发岗

android 程序员 移动开发

android实战视频教程,高并发系统基础篇

android 程序员 移动开发

android开发入门与实战网盘,大佬分享开发经验

android 程序员 移动开发

阿里云新基建丛书新书重磅发布

Lily

android开发技术介绍,Android面试题及答案

android 程序员 移动开发

714页PDF的鸿蒙学习笔记,Android开发必须会的技能

android 程序员 移动开发

androidsdk下载安装,经验分享

android 程序员 移动开发

Android大厂高级面试题灵魂100问,金九银十

android 程序员 移动开发

android嵌入式开发板系统盘,看完就能找到工作

android 程序员 移动开发

android开发入门与实战网盘,值得一读

android 程序员 移动开发

android开发教程百度网盘,2021非科班生的Android面试之路

android 程序员 移动开发

2021高级Android笔试总结,帮你解决95%以上的问题

android 程序员 移动开发

云图说|Git云上仓库哪家好?一张图了解华为云代码托管服务

华为云开发者联盟

代码 华为云 codehub 上云 代码云托管

这4个行业用进销存管理系统是肯定不会错的

低代码小观

企业 企业管理 系统 管理系统 进销存管理系统

android实战的书籍,超通俗解析

android 程序员 移动开发

android工程师面试题,大厂面试题汇总

android 程序员 移动开发

DeFi质押挖矿系统DAPP开发内容(源码)

android开发入门与实战网盘,安卓开发中遇到最难的问题

android 程序员 移动开发

android开发实例论文,详解Android架构进阶面试题

android 程序员 移动开发

android开发实战经典PDF,研发4面真题解析(Android岗)

android 程序员 移动开发

论文解读:ACL2021 NER | 基于模板的BART命名实体识别

华为云开发者联盟

nlp 模板 实体识别 BART命名 NER

android5.0下载,阿里Android研发岗二面

android 程序员 移动开发

DeFi金融借贷系统DAPP开发现成模板

4面阿里拿到P7Offer,Android开发指南

android 程序员 移动开发

android基础知识总结,面试复盘

android 程序员 移动开发

android学习心得,并发编程挑战

android 程序员 移动开发

Android屏幕适配很难嘛其实也就那么回事,含面试题+答案

android 程序员 移动开发

android常用面试题,顺利通过阿里Android岗面试

android 程序员 移动开发

前端开发框架选型清单_架构_崔康_InfoQ精选文章