| 注册
请输入搜索内容

热门搜索

Java Linux MySQL PHP JavaScript Hibernate jQuery Nginx
rita63
8年前发布

三大 JS 框架的较量:Angular.js 与 React.js 与 Ember.js

   <p>通过选择合适的JavaScript框架来更好适配你的项目需求,这有利于提高你的开发能力与web apps的竞争力。</p>    <p>然后,你可以为基于JavaScript的应用或者网站想个极佳的主意。选择合适框架应该对你项目的成功有显著效果。它可以推到你及时完成项目,并且有助于你将来维护代码。JavaScript框架,比如Angular.js,Ember.js,或者React.js,能提供很好的代码框架,并且保持代码的组织性,从而使得你的app更具灵活性与可扩展性,开发过程更加容易。</p>    <h2><strong>JavaScript场景的波动</strong></h2>    <p>Web开发变化速度非常快。几乎每个月都有一个JavaScript框架诞生,并且已存在的框架也在频繁更新。这些框架和开源代码一样,世界各大社区可以对它们进行完善。到头来,比较每个框架的优点与不同点,成了一件不容易的事情。</p>    <h2><strong>Angular Vs React Vs Ember.Deep Dive</strong></h2>    <p>许多开发者都对JavaScript框架有着困惑,因为框架外表与功能差异很大。</p>    <p>下面,让我们来比较三大广泛应用于web的流行JavaScript框架的优点:AngularJs、ReactJs和EmberJs。</p>    <p>框架概览</p>    <table>     <tbody>      <tr>       <td>框架</td>       <td>AngularJS</td>       <td>ReactJS</td>       <td>EmberJS</td>      </tr>      <tr>       <td>概述</td>       <td>主要的 JavaScript MVW 框架</td>       <td>主要用于构建用户界面,但不仅限于此的 JavaScript 库</td>       <td>一个用于创建复杂 Web 应用程序的框架</td>      </tr>      <tr>       <td>创立</td>       <td>2009 由 Miško Hevery 创立</td>       <td>2013 年由 Jordan Walke 创立,开源</td>       <td>2007 年由 Yehuda Katz 创立,名为 SproutCore,2011 年被 非死book 收购,更名为 EmberJS</td>      </tr>      <tr>       <td>主页</td>       <td><a href="/misc/goto?guid=4958834801588021319" rel="nofollow,noindex">https://angularjs.org/</a></td>       <td><a href="/misc/goto?guid=4959724027462586909" rel="nofollow,noindex">https://reactjs.net/</a></td>       <td><a href="/misc/goto?guid=4958340976610047764" rel="nofollow,noindex">http://emberjs.com/</a></td>      </tr>      <tr>       <td>Github</td>       <td><a href="/misc/goto?guid=4958825667342879893" rel="nofollow,noindex">https://github.com/angular/angular.js</a></td>       <td><a href="/misc/goto?guid=4958838693197771340" rel="nofollow,noindex">https://github.com/非死book/react</a></td>       <td><a href="/misc/goto?guid=4958848224592517640" rel="nofollow,noindex">https://github.com/emberjs/ember.js</a></td>      </tr>      <tr>       <td>错误报告</td>       <td><a href="/misc/goto?guid=4959724027784703476" rel="nofollow,noindex">https://github.com/angular/angular.js/issues</a></td>       <td><a href="/misc/goto?guid=4959724027784703476" rel="nofollow,noindex">https://github.com/非死book/react/issues</a></td>      </tr>      <tr>       <td>授权</td>       <td>MIT</td>       <td>MIT</td>       <td>BSD-3-Clause</td>      </tr>      <tr>       <td>使用该技术的知名网站</td>       <td>油Tube, Vevo, Freelancer, Istockphoto, Weather, Sky Store</td>       <td>非死book, Instagram, Khan Academy, New York Times, Airbnb, Flipkart, Sony Lifelog</td>       <td>Apple Music, Yahoo!, LinkedIn, TinderBox, Netflix, Groupon</td>      </tr>      <tr>       <td>理想用途</td>       <td>建立调试活跃和互动的 Web 应用程序</td>       <td>数据变化频繁的大型 Web 应用程序</td>       <td>动态 SPA(Scratch Pad Area,暂存区)</td>      </tr>     </tbody>    </table>    <h2><strong>AngularJS.框架空间的王者</strong></h2>    <p>Angular.js是一个应用模型-视图-控制器(MVC)结构(Angular 1)的开源web应用框架,模型-视图-视图模型(MVVM)结构(Angular 2),版权归谷歌所有。它是以上最老的三大框架命名。因此,他拥有最庞大的社区。Angular.js通过径向扩展HTML功能,解决了开发SPA的问题(单页应用)。框架的突出特点是快速启动与运行你的app。</p>    <h3><strong>AngularJs 的优缺点</strong></h3>    <p>优点:</p>    <ul>     <li> <p>自定义文档对象模型(DOM)元素的 创建 。</p> </li>     <li> <p>明确的UI设计与替换。</p> </li>     <li> <p>当在一个HTML文档创建输入属性时,会为每个渲染属性创建一个独立的数据 绑定。在发生变化需要重渲染之前,Angula先检测 r页面的 每一个明确属性。</p> </li>     <li> <p>依赖注解。</p> </li>     <li> <p>简单路径。</p> </li>     <li> <p>代码容易测试。</p> </li>     <li> <p>框架支持HTML语法 的 扩展 ,直接创建可复用的组件。</p> </li>     <li> <p>稳健的模板生成方案。在HTML属性使用绑定表达式来驱动模板功能。Angular的模板引擎拥有一个深度理解的DOM,它的优越结构模板减少了创建生成页面所需的代码量。</p> </li>     <li> <p>数据模型对于小规模数据的使用有所限制,其目的为了使得代码简单容易测试。</p> </li>     <li> <p>快速渲染静态列表。</p> </li>     <li> <p>良好的代码复用(Angular库)。</p> </li>    </ul>    <p>痛点:</p>    <ul>     <li> <p>API指令的复杂度高。</p> </li>     <li> <p>对于有 元素 相互调用的 页面,Angular速度变得很慢。</p> </li>     <li> <p>初始设计变得慢起来。</p> </li>     <li> <p>由于大量DOM元素,影响性能。</p> </li>     <li> <p>复杂的第三方集成。</p> </li>     <li> <p>曲折的学习路线。</p> </li>     <li> <p>域容易使用,但是难以调试。</p> </li>     <li> <p>路径具有局限性。</p> </li>    </ul>    <p>提示:Angular 2 的功能与上述有所不同。Angular 2 没有沿用Angular 1 的设计,它彻底重写了。该框架两个版本有翻天覆地的变化,在开发商之间引起很大的争议。</p>    <h2><strong>ReactJS. 领域中的新生代</strong></h2>    <p>ReactJS是一个开源库,利用其惊人的渲染性能来构建持久的用户接口,由非死book推出与发布。React在模型视图控制器结构中专注“V”层。React首次发布之后,它迅速达到顶峰。它的出现是为了解决其他JavaScript框架的共同问题——渲染大数据集合的效率。</p>    <h3><strong>ReactJs 的优缺点</strong></h3>    <p>优点:</p>    <ul>     <li> <p>接口设计与学习API容易。</p> </li>     <li> <p>与其他JavaScript框架相比,具有显著性能。</p> </li>     <li> <p>更新速度快。React创建一个新的虚拟DOM,利用最近数据与比较上个版本的差异提供完善修复机制,创建一个最小的更新列表构成真正的DOM使其同步,而不是每次发生变化都进行重复渲染。</p> </li>     <li> <p>服务端渲染允许创建同构/通用的web apps。</p> </li>     <li> <p>容易导入组件,虽然有一些依赖。</p> </li>     <li> <p>更好的代码复用。</p> </li>     <li> <p>方便JavaScript的调试。</p> </li>     <li> <p>在提高复杂组件性能方面,Angular与React难分高低。</p> </li>     <li> <p>基于层次的全系组件。</p> </li>     <li> <p>JSX,一个JavaScript扩展语法,允许引用HTML与使用HTML标签语法来渲染子组件。</p> </li>     <li> <p>React Native 库。</p> </li>    </ul>    <p>痛点:</p>    <ul>     <li> <p>它不是完整框架,它是一个库。</p> </li>     <li> <p>非常传统的视图层。</p> </li>     <li> <p>Flux结构是开发者使用过的一个与众不同的范例。</p> </li>     <li> <p>大量开发者不喜欢JSX。</p> </li>     <li> <p>曲折学习路线。</p> </li>     <li> <p>集成React到传统MVC框架,犹如铁轨一样需要一些配置。</p> </li>    </ul>    <h2><strong>EmberJS. 挑起重担</strong></h2>    <p>EmberJS 是一个开源的JavaScript框架,用以创建单页 客户端web应用 ,使用模型-视图-控制器(MVC)模式。该框架提供通用数据绑定, 基于网址驱动的方法用于构建不同应用,重点放在可扩展性上。</p>    <p>在2007年,Ember起源于SproutCore。在2011年,它被非死book收购,重命名为Ember。它从本地框架例如苹果的Cocoa使用轻量灵敏性中,结合了成熟概念。</p>    <h2><strong>EmberJs 的优缺点</strong></h2>    <p>优势:</p>    <ul>     <li> <p>约定优于配置。Ember.js支持跟随命名约定于自动生成代码,而不是在你的应用不同路径提供详细配置,专款专用的情况下,不遵守公共约定。</p> </li>     <li> <p>客户端渲染,在视图层之外扩展web应用结构。</p> </li>     <li> <p>支持URL。</p> </li>     <li> <p>Ember的对象模型有利于键值对的观察。</p> </li>     <li> <p>嵌套的UIs。</p> </li>     <li> <p>最小化DOM。</p> </li>     <li> <p>在庞大应用生态系统运行良好。</p> </li>     <li> <p>很好地集成java与强大数据层。</p> </li>     <li> <p>完全成熟模板机制(处理板模板引擎构建基于流行的Mustache模板引擎),减少了代码编写。它并不知道什么是DOM,而是直接依赖文本操作,构建动态的HTML文档。</p> </li>     <li> <p>使用观察者来观察内容的变化,只需要重新渲染改变的部分。</p> </li>     <li> <p>使用配件避免“脏检查”。</p> </li>     <li> <p>更快的启动时间与固有的稳定性。</p> </li>     <li> <p>性能专注。</p> </li>     <li> <p>友好的文档API接口。</p> </li>    </ul>    <p>痛点:</p>    <ul>     <li> <p>Ember.js在控制等级上缺乏组件复用。</p> </li>     <li> <p>有许多再也不用的过时内容与例子。</p> </li>     <li> <p>曲折学习曲线。</p> </li>     <li> <p>处理板有大量<脚本>标签会污染DOM,它被用作标志,保持模板与您的模型同步更新。</p> </li>     <li> <p>它的典型用法会很繁琐。</p> </li>     <li> <p>Ember的对象模型安装后体积过度膨胀与调试时调用栈。</p> </li>     <li> <p>框架中最具争议的并且是最笨重的。</p> </li>     <li> <p>对于小项目有点大材小用。</p> </li>     <li> <p>测试手段似乎是模糊的,不够完整。</p> </li>    </ul>    <h2><strong>清楚你的需求并且选择最有前途的框架</strong></h2>    <p>到底哪个框架适合你,取决于对你的应用程序需求评估与框架性能的匹配度。这需要深入剖析每个框架的优势与不足,它们 如何应用于 不同场合。所有框架有许多共同点:它们都是开源的,拥有发布版本证书,也是使用MVC设计模式来创建SPAs。它们都有视图,事件,数据模块与路径。但是,不同JavaScript框架能更好地适合不同类型的应用程序。</p>    <p>假如你正在决定创建一个web app,Angular,React和Ember是最安全提供长期支持并且活跃的社区。另外,最近Angular是三者中最流行的(框架)。你可以把它当做一站式服务商店来 使用。大企业倾向选择它作为框架。Ember则是提供框架中工具齐全的最佳解决方案,所以你不必花费反复查询与合并库。由于Ember需要花很长时间来学习,它比较适合长期的项目。React是以上框架中最轻量级的。它在这方面做得尤为出色:渲染UI组件。许多场合甚至把它应用于上述的框架。假如你需要逐步改善存在的代码,它将是一个合适的选择。</p>    <p>如你所见,没有绝对的王者。对于特定工程,一些框架比其他更加适合。从几个角度检查你的项目,包括:成熟度、大小、依赖、互相操作性与特征等等。联系专业的web开发公司来构建完美的网站架构和网站设计,以达到最适合你的业务需求。</p>    <p> </p>    <p>来自:https://www.oschina.net/translate/comparison-of-js-frameworks</p>    <p> </p>    
 本文由用户 rita63 自行上传分享,仅供网友学习交流。所有权归原作者,若您的权利被侵害,请联系管理员。
 转载本站原创文章,请注明出处,并保留原始链接、图片水印。
 本站是一个以用户分享为主的开源技术平台,欢迎各类分享!
 本文地址:https://www.open-open.com/lib/view/open1478584973728.html
Ember.js React JavaScript开发 angularjs