如何选择更合适的前端框架？
本帖最后由 断天涯大虾 于 2016-12-21 09:22 编辑最近一段时间是令前端工程师们非常兴奋的时期，因为三大Web框架陆续发布新版本，让我们见识到了更强大的Web框架。
Ember2.0在2个月之前已经发布，从1.0升级到2.0非常简单。几周之前React发布了0.14版本。还有很多流行的前端框架，像Backbone 、Knockout及Aurelia。
如果你想开发一个Web app，建议采用Angular,Ember或React三种框架中的一个。这三个框架可以说是安全级别最高，技术非常成熟的框架，而且有很多技术社区支持。那么，你又开始纠结了，开发Web app，到底选择哪个框架，哪个更好用更安全更强大呢？
本文就详细介绍三大框架新版的优缺点并进行对比，希望能够对你们有用。http://smashingboxes.com/media/W1siZiIsIjIwMTUvMTAvMjAvMTAvNDEvNDgvOTE5L2FuZ3VsYXJfMi4wLnBuZyJdXQ/angular%202.0.png?sha=c182c65bfad4aa24一、Angular 2.0（与1.0对比，发生了翻天覆地的变化）Angular是目前最流行的框架之一，Angualr1.0 首次发布时让业界很多人士为之震撼，它使MVC框架更上一层楼。Angular的发布引起了众多Web开发人员的共鸣，然而Angular2.0却是一片唏嘘声，是超越1.x的彻底革新，也可以说是破坏性的升级。
Angualr2.0版本重新定义了框架，自身发生了非常巨大的变化，可以说是很戏剧性的变化，Angualr2.0不支持向下兼容，使低版本升级到2.0版本成为一条绝路。然而软件行业总是充满了奇迹和天才，Angular 团队为从Angular1.X 到2.0的升级指出了一条明路，使升级变成渐进增强的过程，我想正是因为这个方法拯救了Angular。
到底Angular2.0有什么令人兴奋的功能？Angular2.0砍掉了一些不必要的功能，提升了Angular的性能，如$scope从Angular 2.0中移除，取而代之的是ES6类。除了框架自身变得更简洁，还有一些其他注意的特性：
[*]性能提升
性能提升可以说是众望所归，如果你对Angular 非常熟悉，你已经具有分解功能的能力，创建App也不在话下，性能问题总是有办法解决的。
[*]原生App支持
使用Angular开发原生应用是2.0版本的最大改进，Agular团队与React联合，在Angular 2.0 中底层使用React Native渲染原生App，可实现新一代的混合App，执行过程与本地App相同，但可在逻辑层可在多平台中 共享。
[*]服务器端渲染能力
Angular2.0终于实现了服务器端渲染，服务器端渲染能力有所提升，减少了初始页面加载时间，可通过动态页提升SEO。页面渲染速度提升将大大改进Web App的体验。http://smashingboxes.com/media/W1siZiIsIjIwMTUvMTAvMjAvMTAvMzEvNTkvNTUzL1NjcmVlbl9TaG90XzIwMTVfMTBfMjBfYXRfMTAuMjcuMTdfQU0ucG5nIl1d/Screen%20Shot%202015-10-20%20at%2010.27.17%20AM.png?sha=b9885a92578605b6
为什么选择Angular?Augular 已然成为Web应用开发世界里最受欢迎的开源JavaScript框架。开发新项目选择Angular无疑是一种安全的选择，Angular2.0 与1.0有很大的不同。
事实上，Augular2.0 演化过程与Ember演化类似（Ember最早被称为SproutCore2.0），Angular支持使用TypeScript语言（由微软提供的，为JavaScript提供类型检测等高级功能）。
在实际开发中，很多开发人员还在使用TypeScript。Angular很多方面的改进都期望能够使Angular成为众多企业开发首选的框架，使用2.0目前来看似乎有点冒险，但我相信Angular2.0时代即将到来。
二、Ember 2.0Ember.js号称是一个“雄心勃勃”的JavaScript MVC框架、现代JavaScript MVC框架代表,是构造如单页面应用等现代Web应用程序的新型Web端开发框架。有很多App的创建都在使用Ember，如Apple’s properties,Discourse,Ghost。
Ember是由两个非常传奇的工程师开发创建的，并不是由大企业研发而成，尽管如此，Ember仍有众多强大的技术爱好者的支持。
Ember2.0 特点Ember 2.0主要改进——移除了之前不建议开发的功能，旨在成为一个瘦身框架。在Ember 1.13上运行的程序，可以无缝切换到Ember 2.0上。
[*]Ember 2.0进一步采用ES2015功能模块，类，和decorators。
[*]修改了项目分布结构，使用“pod”分类代替功能分类（控制器，models，组件等）。
[*]控制器被移除，支持路由控件。
[*]高级服务器端渲染器减少了页面加载时间，优化搜索引擎。
http://smashingboxes.com/media/W1siZiIsIjIwMTUvMTAvMjAvMTAvMzIvMzYvMzMyL1NjcmVlbl9TaG90XzIwMTVfMTBfMjBfYXRfMTAuMjYuNTdfQU0ucG5nIl1d/Screen%20Shot%202015-10-20%20at%2010.26.57%20AM.png?sha=a3cf15093adcd58c
谁更适合使用Ember实现Web app ，Ember是最佳选择。如上所述，很多App都内置使用了Ember框架。Ember也将被Ruby协会所接纳。如果你选择Ruby，Ember是不二之选。它有大量的资源供你使用，如文档，技术博客等。
Ember 对购买工具包含框架的人来说是非常好的选择，我们经常会浪费时间去寻找，研究，评估一些开发框架。EMber为您提供的选择非常多，而且都非常有价值。任何事物都有利有弊，但是任何事情都能良好运行那么就选择Ember吧。
三、ReactReact1.0 是三个框架中最轻量级的框架，React在渲染UI控件方面做的非常好，经常与其他框架结对使用。然而更常见的情况就是与Flux 体系架构联合使用。http://smashingboxes.com/media/W1siZiIsIjIwMTUvMTAvMjAvMTAvNDQvNTMvNjk3L1JlYWN0XzEuMC5wbmciXV0/React%201.0.png?sha=886b9b43c826ec79
Flux与MVC 完全不同的体系架构，与React生态系统类似。FaceBook创建React的目的是为了保证多个页面的外观一致性。使用REACt确实达到了这种效果，它提供了令人难以置信的性能和服务器端渲染效果。两种功能都完美实现。有个现象很有趣，Angular和Emver都在争相发布新版本。而React则在它擅长的领域内继续创新。
React1.0版本的重大功能1. 升级项目网站2. 升级框架文档3. 增强动画的鲁棒性
React改进的核心目的为了提升开发人员的体验。React的一大亮点就是使用React提供的元素创建动画会非常简单。http://smashingboxes.com/media/W1siZiIsIjIwMTUvMTAvMjAvMTAvMzIvNTkvNzAyL1NjcmVlbl9TaG90XzIwMTVfMTBfMjBfYXRfMTAuMjcuMzFfQU0ucG5nIl1d/Screen%20Shot%202015-10-20%20at%2010.27.31%20AM.png?sha=4a027d6af769157b
谁更适合使用React？开发新项目或是改进存在的项目，React都是很好的选择。使用React框架，可以让App UI 创建以及重新创建UI 变得很简单。如果你想逐渐改善存在的项目，选择React是非常合适的。
React项目通常用ES2015编写，如果您的价值正在边缘化或只需要应用框架中一些简单的库，React就是最佳选择。
四、三大框架对比首先说明的是三大框架可以覆盖所有需求。这些框架的功能都很独特，许多好的设计和实现思想都已经在三大框架中体现的淋漓尽致了。Ember可视为是启动最快的框架。但是Ember 的学习成本较高。就最终App而言，Angular JS 开发的app只需要写很少的代码。http://smashingboxes.com/media/W1siZiIsIjIwMTUvMTAvMjIvMTQvMDEvMjQvMjUvU2NyZWVuX1Nob3RfMjAxNV8xMF8yMl9hdF8yLjAwLjIwX1BNLnBuZyJdXQ/Screen%20Shot%202015-10-22%20at%202.00.20%20PM.png?sha=690cea3d157763dc
从上图种可以看出，为什么三大框架如此流行，优势都很明显。三个框架没有绝对的好，只有相对而言，哪个更满足项目需求，满足App开发所需的功能。三大框架在以后发展中会更快且更好的支持服务器端渲染。
Angular和React 将支持IOS和Android的原生UI控件。使用此三种框架未来能够做很多的事情。
五、支持Angular的开发工具新一代HTML5 / JavaScript UI控件 Wijmo，大而全面的前端开发工具包，现已全面支持Angular 2。
页:
[1]