有些事情发生了变化,另一些发生了变化。 最新的是什么?
> Photo by the author.
数量众多的前端框架会让您大吃一惊。 框架种类繁多:反应式,声明式,功能性,MVC,MVVM,OOP等。 但是最受欢迎的仍然是React和Angular。 截至2020年,它们之间有什么区别?
什么是React?
React是一个由Facebook开发和开源的UI库。 我要强调的是它是这里的图书馆。 稍后我将解释为什么这很重要。
React是目前最受欢迎的UI库,它为数千个网站提供支持。 React使用JavaScript作为主要语言,可以在许多平台上运行,包括Web,Android,iOS甚至VR。
什么是Angular?
Angular是由Google开发和开源的前端框架。 马上,您会发现它们根本不同:React是一个库,而Angular是一个框架。 在上一节中,我将解释这两个术语之间的区别。
Angular使用TypeScript作为其主要语言,并且还能够在多种平台上运行。 Angular的架构采用MVC(模型-视图-控制器)模式,该模式被认为是行业标准之一。 那么,React和Angular之间有什么相似之处?
它们如何相似?
首先,React和Angular都产生相同的可交付成果:一个前端应用程序,无论是网站,应用程序还是介于两者之间的东西。 两者都在后台使用JavaScript,并充分利用了NPM(节点程序包管理器),这使得共享重复代码非常容易。
社区
这两种产品背后都有庞大的社区。 由于React和Angular是开源的,因此许多公司都依赖它们并试图使其保持运行和更新,因此使用它们时您会感到相对安全。 由于文档不完整,缺少关于Stack Overflow的帮助或第三方库的可用性,您不太可能会遇到很多问题。
建筑
这两种解决方案都提供了与MVC相似的体系结构,尽管存在一些误解(正如我将在上一节中所述)。 另外,Angular和React都允许您使用TypeScript进行开发,但是只有React支持纯JavaScript。 最后,这两个都是基于组件的,这与其余的UI框架(Vue,Flutter等)非常一致。
它们有何不同?
好家伙。 在这里,我们还有很多要点-我认为这就是您阅读本文的原因。 因此,让我们开始吧。
库与框架
如前所述,React是一个库,Angular是一个框架。 简而言之,库可以解决问题,而框架则可以解决问题。 多数情况下,框架由库组成。 这实际上是什么意思:React非常轻巧,快速并且易于学习,但是它本身并不会做任何事情(除了绘制一些按钮之外)。 您将需要用于路由,API连接,状态管理等的第三方库。另一方面,Angular具有此库,并且内置得多。 Angular虽然较难学习,但为您提供了不错的功能,例如路由,表单生成,依赖项注入等。 在MVC中,React只占部分,但是Angular就是整个。
常规DOM与虚拟DOM
在屏幕上渲染内容时,Angular和React使用略有不同的方法。 Angular的行为就像您期望的那样:在每次重新渲染时,它都会从头开始构建一个新的DOM并将其替换在浏览器中。 另一方面,React尝试尽可能重用。 它计算将浏览器的DOM带到React的内部虚拟DOM并执行它们所需的最少操作集。 这将带来巨大的性能提升,一旦并发模式推出,这一点将更加明显。
可扩展性
这是Angular的强项之一。 由于Angular实施的架构更加复杂,因此扩展起来更容易。 在React中,太多的东西放在开发者的肩膀上,并且搞砸起来要容易得多。 但是,直到代码库足够大时,您才会注意到它。 当然,可以通过应用"干净架构"原则来减轻这种情况,但是您需要意识到这一点。
移动开发
React曾经是该部门的明显赢家,但现在还不那么明显。 React Native允许您使用React编写本机应用程序,NativeScript允许您使用Angular和Vue编写本机应用程序。 两者都提供比较的性能和功能集。 区别在于平台访问。 如果要访问React Native中的某些本机API方法,则必须使用Kotlin或Swift编写一个桥。 在本机脚本上,您可以直接从JS代码访问本机方法。 另一方面,React Native具有更大的社区,这是无价的资产。 但是,如果性能是重中之重,则应考虑使用Flutter。
结束语
感谢您的阅读。 我希望您现在对React和Angular之间的区别有所了解。 如有任何疑问,请告诉我。