App开发:Vue Native vs React Native
随着移动应用开发框架数量的增加,2018年Vue Native的引入让开发者有能力使用Vue.js代码来创建React Native移动应用。
因为 Vue Native 围绕 React Native 包装了 Vue.js 语法,所以框架非常相似。例如,两者都是跨平台框架,这意味着相同的代码库可以编译为适用于 Android 和 iOS 环境的应用程序。
这意味着开发人员只需学习一种框架语法并编写一次代码,这与学习和编写 iOS 和 Java 的 Objective-C 或 Swift 或 Android 的 Kotlin 不同。
这两个框架都是开源的,任何人都可以贡献其源代码并使用。本质上,在 React Native 中所做的一切都可以在 Vue Native 中完成。
所以,如果Vue Native的核心是React Native,为什么要有一个单独的框架呢?Vue Native最初的目标是将Vue的所有优势与React Native的优点结合起来,提供React Native所没有的一些功能。
为了探索其中的差异,我们将看看React Native和Vue Native的功能、社区、它们的易用性等等。
功能
在 React Native 中工作时,开发人员可以使用 React 的语法和核心原则构建原生应用程序。它通常被称为一个不受约束的框架,这意味着它带有很少的官方库和功能。
它的创造者倾向于在构建应用程序和解决不同问题时给予开发者自由,让那些不想从头开始写代码的开发者使用社区开发的第三方库构建不同的功能。
其中一些库包括:
- React Hook Form 或 Formik 来创建和验证表单
- React Tesing库和 Jest 来测试应用程序
- Fetch API 和 Axios 进行网络请求
这一优势允许开发人员使用 JavaScript 创建原生移动应用程序。而且,由于它只在不同平台上使用一个代码库,因此 React Native 可以为公司节省时间和金钱。
与其雇佣两个不同的团队——一个针对 iOS,一个针对 Android——公司可以雇佣一个 React Native 团队来构建这两个版本,从而减少他们工资单上的开发人员数量。
然而,即使第三方库可以被视为一种优势,这些库往往也会过时。如果社区对特定库的支持不够强大且不经常更新,就会出现不兼容性问题。
通过利用React Native的Vue Native,开发者可以获得React Native的所有好处。因为Vue Native的代码在编译成移动应用之前就会转入React Native,所以除了Vue之外,你不需要从头开始学习React。
因为Vue Native使用React Native包来访问移动设备的API,开发者可以访问React Native的社区和它的库。
与React Native一样,使用Vue Native的公司可以通过为Android和iOS应用使用一个代码库来节省时间和金钱。
但是,由于Vue Native对React Native的依赖,该框架的全部增长都依赖于React Native的增长,包括React Native库的维护和生产。
由于Vue Native继承了所有React Native的限制,如果React Native被弃用,Vue Native就无法生存。
然而,Vue Native 相对于 React Native 的一个优势是它允许双向数据绑定。这意味着与 React Native 的单向数据流不同,这意味着开发人员可以编写更少但更简洁的代码,使用双向数据流加快开发和创建功能。
性能
与使用 WebView 的混合应用程序不同,Native应用程序直接与平台的原生组件交互。因此,像 React Native 和 Vue Native 这样的原生应用程序更快、更高效,因为它们是针对它们运行的平台量身定制的。
然而,React Native和Vue Native并不支持多线程。这两个框架的进程不是并排运行,而是一个接一个地运行,使应用程序变慢。
例如,当一个页面即将渲染时,一个线程处理页面所需,而另一个线程则渲染页面的用户界面。如果数据线程正在处理大量的数据而拖住了UI线程,应用程序可能会冻结或运行得很慢。
对于这两个框架,编译、运行和测试应用程序需要安装Xcode或Android Studio,为编译过程增加了一个步骤,而不像其他移动开发框架允许在网络浏览器中运行应用程序。
虽然Vue应用程序通常比React应用程序稍快,但Vue Native代码在任何编译开始之前就会转到React Native。因此,Vue Native继承了React Native中出现的任何性能问题,使得这两个框架的性能实际上是相同的。
社区
在GitHub上有超过2000名贡献者和不到70万名用户,在Stack Overflow上有一个庞大的社区,React Native拥有开发者在框架中学习和成长所需的支持。
而且,因为React Native是基于JavaScript的,是一个跨平台的框架,所以它在开发者中很受欢迎。
其他使用React Native框架的公司包括:
- 沃尔玛
- 微软
- 特斯拉
- Discord
- Shopify
- Espo
由于 Vue Native 还比较新,网上可供开发者使用的资源和资料并不多。它在 GitHub 上只有不到 20 名贡献者和不到 1,000 名用户,在 Stack Overflow 上有一个小社区。但是,它确实有全面的文档。
目前使用 Vue Native 的公司包括:
- Spikedmelon
- TurkDevOps
- FinTech Consortium
由于 React Native 已经存在的时间更长并且得到了 Facebook 的支持,更多的开发人员和大公司使用它,所以它显然在这里取得了胜利。
学习曲线
作为流行的 JavaScript 框架,Vue.js 也被认为是最容易学习的框架之一,它在单文件组件和 Javascript 中具有简单的 HTML 和 CSS。
有了Vue的语法糖,其语法比React Native的语法更容易阅读,也更简明。
然而,React Native使用JSX作为其模板语言。React Native使用单独的组件,在同一个文件中包含属于某个组件的标记和逻辑,而不是通过将它们放在不同的文件中来分离标记和逻辑,这是通过JSX实现的。
这种面向组件的方法使开发者能够一次性创建组件,并根据需要通过组合标记、样式和逻辑多次重复使用。
JSX使创建这些组件变得简单,而且由于它是静态类型的,开发人员可以及早发现错误,改善调试和开发质量。
它还能在编译时优化代码,因此由JSX生成的JavaScript代码比直接用JavaScript编写的同等代码运行得更快。
然而,正因为如此,开发人员不能使用CSS进行样式设计,只能用JavaScript进行样式设计。虽然JSX不是特别困难,但是大多数开发人员使用HTML和CSS来标记和样式化,并且适应这种新的范式可能需要一些时间。
这是 React Native 中 JSX 和样式的示例:
import React from 'react';
import { Text } from 'react-native';
const Example = () => {
return (
<Text style={[ color: 'red' ]}>Example text in React Native!</Text>
);
}
export default Example;
要使用 JSX,开发人员必须导入 React
库和他们想要使用的任何 React Native 组件;在这个例子中,用于显示文本的 React Native 组件是 Text
。
Example
函数返回一行文本,其中应用了一些基本样式以使文本变为红色,并且 Text
标记标记嵌入到 JavaScript Example
函数中。这种样式是 JavaScript,而不是 CSS。
用 export default
导出组件可以让你在任何地方使用这些组件。
现在,这是 Vue Native 代码的示例:
<template>
<text class="text-color">Example text in Vue Native!</text>
</template>
<style>
.text-color {
color: red;
}
</style>
<script>
</script>
如果您有 Web 开发背景,上面的 Vue 代码应该很直观。所有标记都写在 template
标签中,类似于 web 开发中的 html
标签。
text
标签代表Vue Native用于显示文本的组件。通过给它分配一个名为 text-color
的类,你可以使用 style
标签中的类名对文本进行CSS样式设计。
你也可以在 script
标记中编写JavaScript代码来操作应用程序中的标记和数据。
由于其代码结构的直观性,Vue Native通常被认为比React Native更容易学习。
对技能的需求
由于它在开发者和企业中的受欢迎程度,在市场上的时间,以及Facebook的强大支持,开发者市场对React Native技能有需求。
然而,Vue Native仍然没有得到广泛应用,对Vue Native技能的需求也很少。
除非使用Vue.js的公司更有可能采用Vue Native,因为它熟悉且相对容易上手,React Native在知名应用中的流行和使用使React Native成为比Vue Native更好的学习技能。
你应该使用 Vue Native 还是 React Native?
这两个跨平台的移动应用程序开发框架使用相同的代码工作,Android 和 iOS 都可以使用,最终节省时间、金钱和精力来学习跨不同操作系统的新编程语言。
当谈到挑选最佳框架时,选择取决于开发人员对所选框架的熟悉程度:Vue或React。
通过挑选你已经熟悉的,你可以为自己节省大量的时间和压力,并在移动应用程序的开发中一马当先。
但值得注意的是,像就业机会、社区、以及被试用和信任的框架等因素都有利于React Native。所以,如果你不看效率,而是看成熟度和就业市场,React Native很容易就赢得了胜利。
然而,如果你只是想要一个最简单的学习曲线的框架,Vue Native可能更适合你。