前端框架的选择

前端发展日新月异,每年成百数千框架诞生,当我们需要选择一种来学习时,应该如何挑选?

我认为应该从两方面来看:框架优劣的重要性自不必说,影响性能和开发体验,但另一方面适合自己的需求也很重要,尺有所短寸有所长,在不同情况下的优劣可能相反。

框架的优劣

Paste_Image.png

这是去年主流前端js框架的github新增star数量,很大程度上能体现一个框架的受欢迎程度,受欢迎程度又在一定成都上说明了,框架的优劣,大量程序员都喜欢的一定不会很差。

重点来看前三者,三者中,angular的适用范围相对窄一些,react可以拓展到服务端、移动端native部分,vue最轻量、还可以用于业务场景非常轻的页面中(不用全家桶也不错)。下面从几个方面来比较一下这三种框架的优劣:

状态:

在业务界面中我们经常需要数据和界面的交互,根据某些数据去生成界面,通过界面上的操作去改变数据。这其中有两种,一种就是数据到界面,一种是界面到数据,使用原生或者jquery实现这种操作要大量代码,而且实时更新也很麻烦,所以主流框架都在交互上进行了封装处理。
MVVM流派的angular、vue,通过类似模版的语法,通过内部转换,构建数据和界面状态的绑定关系,甚至双向绑定,监听界面变化,当界面发生改变,按照规则去更新响应的数据,然后,再根据配置好的规则,从数据更新界面状态。
react则通过函数式编程实现,推崇的是单向数据流:给定原始界面或数据,施加一个变化,就能推导出另一个状态,有点像状态机。

组织:

整个业务代码的模块关系、业务模型。模块关系共识就是组件化,整个应用形成组件树,每个组件树提供对外接口,用来数据交互,然后内部只关注自己的实现,需要考虑组件的定义、约束、管理、测试等很是复杂;react和vue的组件化成都要优于angular。业务模型指的是所处领域中的业务数据、规则、流程的集合。即使抛开所有的展示层,这一层也是应当要能够运作起来的。react有redux来辅助管理,angular2引入了RxJS,vue有vuex。如果是学习能力强的人,发现面向函数编程模型的时候会非常喜欢,但是对于大型项目,并非好事。用面向对象、面向过程的那些方式,虽然笨重,但是门槛低,符合大多数人的理解和思维模式,而且经验丰富。

效率:

分为开发效率和运行效率。组件化是提升开发效率的一种手段,具体到单个组件的实现上,mvvm系的代码量会少一些、开发效率稍高一些。其中,angular因为实现的特殊性,有作用域继承之类的双刃剑黑魔法,开发效率的不稳定因素要高不少,深刻理解的人用起来效率很高,不理解的用了到处是坑。angular是三者中运行效率最低的那个,主要在于数据变更方式是脏检查,当监听数量提高时,极大影响性能。在针对现实情况的测试中,vue是效率最高的那个(使用和react共同约定的测试基准),在大数据的情况下,react效率最高。

学习曲线:

angular1学习曲线陡峭,大量新的概念、晦涩的说明、复杂的指令;angular2即使不用typescript,它使用es2015的js,18个npm依赖包、4个文件、超过三千多字的介绍来实现一个hello world!;react学习曲线陡峭,需要了解jsx和es2015,需要学习构建系统;vue需要你熟悉html、符合es5的js。

自身的需求:

尤雨溪大神回复关于框架选择的问题:
https://www.quora.com/Which-should-I-learn-Mithril-Vue-or-Angular/answer/Evan-You-3
首先要明确自己的需求:
1. 在短期内尽快找到工作
2. 创造更快应用
3. 作为学习经验来提高javascript

对于目标一,去学习,最主流、最受企业欢迎的框架,能够帮助你提高就业竞争力。
对于目标二,如果是一个依靠后端的展示页面应该选择更轻、更少插入、不需要特定工具,并且使用html;如果是SPA必须深入了解性能、功能、API友好性、工具支持、生态系统成熟度等方面的实际技术对比。这是主观的、项目依赖的。
对于目标三,应该从轻量级的东西开始学习,大型框架的API很全,封装的很好,主要是在学习使用框架的API和约定,但是需要自己写的地方就少了,不利于提高自己的编码能力。另一方面,方便你理解不同的部分实际上是如何组合的。

尤雨溪大神还建议首先把javascript本身学到精通,这样风险很小。有了坚实的基础可以迅速掌握简单的框架。单独使用这些框架来写个小的应用,来了解这些框架解决什么问题,喜欢哪一种、什么样风格的API是你更有效率,从而可以尝试大型框架。这样比尝试一个大型框架几个月发现不适合自己要好的多。
另一方面他还建议我们了解es最新版本的语法,基本的node.js、npm如何工作,框架系统、打包工具这些与框架无关但是可以应用在任何框架中的技术。核心思想是不要把鸡蛋放在同一个篮子,选择js框架不是选择党派战队,不必永远坚持一个。无论别人说什么不要在没有尝试的情况下,为自己做出决定。如果只使用一个框架而忽略其他的,几乎肯定是错的。

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值