前端框架

Posted 2021-03-18 cainiaoputeng

一、基本介绍

Angular、 React、Vue是目前三大主流的前端框架，这三个框架都有很好的性能(这里的angular指的是2.0+)，都支持数据绑定，组件等基本功能。
1.1 Angular是一个基于TypeScript的javascript框架。它由Google开发和维护。这是第一次在2010年10月发布。
1.2 React于2013年3月首次发布，被描述为一个JavaScript库。React由Facebook开发和维护
1.3 Vue是当今世界上发展最迅速的JavaScript框架之一。Vue被描述为“用于构建交互式界面的直观，快速和可组合的MVVM”。它于2014年2月首次发布。它是前谷歌员工尤雨溪的创意。
二、综合比较
2.1 Angular
（1）这是一个完整的框架拥有良好的项目结构 通常情况下，我们编写的js代码是没有正规的项目结构的，是因为在小型项目中对结构的要求很低，但是在大型项目中则完全不同，比，如webapp中ionic框架就是用的Angular作为内核个人觉得也是看中了angular的这个特点。但是会丢失一些灵活性。
（2）拥有自己的构建工具 在Angular-CLI 使用打包编译，生成组件等都有相应的命令行，非常方便快捷，虽然vue和React也有构建工具，但是局限性很大，需要配合其他构建工具，个人觉得Angular-CLI足够强大，这也是一套完整的框架的带来的红利，不必在选择库上浪费时间。
（3）体积较大 虽然在angular2+之后使用了AOT和 tree-shaking，但是相对于其他轻量级框架来说还是略显臃肿，加载较慢。
（4）学习成本较高 需要很多基础概念和使用较复杂的api接口，入门相对困难。而且angular2.0+用的是ts语言，需要对ts语言有一定程度的了解。而且从angular1.x升级到2.x的时候框架几乎是重写了一遍，导致之前用angular1写的程序维护起来比较困难。如果是新入门学习angular，推荐从2开始学起。
（5）跨平台优势 有ionic等使用angular作为内核的框架，如果是用angular开发pc端+移动端的跨平台开发，组件服务指令都可以复用，这对开发这来说是非常不错的，react有React Native同样也是跨平台非常不错。vue有与阿里合作Weex，但是目前来说跟前两个还有很大差距。
（6）生态系统庞大 angular和react都有庞大的生态系统，vue相对较差
总结：它是一个成熟完善的框架， angular适用于大型项目，所以会有一些代价，比如学习成本高，如果你只是想用到组件，数据绑定等基础功能去开发一个小型应用，那么最好不要选择angular。
2.2 React
（1）灵活性 从不限制你用什么样的代码组织结构，更加随意。
（2）生态圈强大 因为react把路由库和状态管理库交给社区维护，虽然相对来说这些方面不如vue和angular的官方发布稳定，但是造就了生态圈的繁荣。
（3）跨平台优势 React Native 能使你用相同的组件模型编写有本地渲染能力的 APP (ios 和 android)。能同时跨多平台开发，类似于ionic。
（4）学习成本一般 在你开始学 React 前，你需要知道 JSX 和 ES2015，相对于vue是学习难度高，相对于angular来说比较好学，如果要构架大型应用，它的生态是相对复杂，个人觉得没有angular官方发布的文档清晰。
总结：react和vue一样只关注视图层，这跟angular有本质的区别，如果react想开发大型应用需要配合第三方库，他的跨平台优势和生态优势大于vue。
2.3 Vue
（1）灵活性 这点和React和相似，Vue可以与已知的库或框架很好地配合。
（2）实用性 它虽然很轻量，但是却拥有很强大的实用性，数据绑定，计算属性侦听器，组件等常用功能不次于angular。在很多方面比angular更容易上手。
（3）体积小 vue相对于angular体积小了很多。
（4）学习成本较低 你只需要有良好的 html 和 JavaScript 基础就可以通过官网上的阅读指南快速投入开发，相比于react和angular都有很大的优势，angular需要学习各种各样的api，理解各种基础概念，还有学习ts语言才能进行开发；react需要知道 JSX 和 ES2015还需要学习构建系统等。
总结：轻量，学习成本低等等，优点很多，灵活，性能好，构建项目可大可小
三、如何选择
3.1 在大型超大型web应用开发上，看好Angular，深度整合Typescript和Rxjs。ts解决了工程化的问题，rxjs解决了开发速度的问题。但是学习成本，可能对于Java，c#等OOP工程师来说比较容易上手，但是对于JavaScript工程师来说，少有工程化的经验，接受起来比较痛苦。
3.2 个性化需求、中型应用，更倾向react，在中大型应用中，不是一定要搞Java那一套的，而且在前端这种对工期要求很紧的领域，没必要因为添加新功能而更换新的平台，能用到rxjs和依赖注入的前端应用场景并不多。所以如果采用react，从项目一开始就渐进式地添加模块，往往更适合快速发展的产品。
3.3 小型应用上，看好vue，其实绝大部分web应用，都应该只是小型应用。公司官网，论坛，甚至是规模不大的电子商务网站和基本功能的OA，ERP系统，都只是小型web应用。它们数据源稳定，对于运营的要求不高，但是对加载速度等都有很高的要求。这个时候，小巧的vue就成了首选。Proxy实现的响应式相比Angular的zone暴力代理和rxjs的复杂操作显得更加接地气，不需要额外地进行学习。对象式的声明在UI实现上速度更快。生态虽然没有react那么热闹但是小而美的库也很多，nuxt的实现值得点赞。

作者：時光_7ea3
链接：https://www.jianshu.com/p/b7888af241cd
来源：简书
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。