React Native 和 React 有什么区别？

Question

出于好奇，我开始学习 React，想知道 React 和 React Native 之间的区别 - 虽然无法使用 Google 找到满意的答案。 React 和 React Native 似乎具有相同的格式。它们的语法完全不同吗？

Answer 1

ReactJS 是一个 JavaScript 库，支持 front-end 网络并在服务器上运行，用于构建用户界面和网络应用程序。它遵循可重用组件的概念。

React Native is a mobile framework that makes use of the JavaScript engine available on the host, allowing you to build mobile applications for different platforms (iOS, Android, and Windows Mobile) in JavaScript that allows you to use ReactJS to build reusable components and communicate with native components

两者都遵循 JavaScript 的 JSX 语法扩展。在后台编译为 React.createElement 调用。 JSX in-depth

两者都是 Facebook open-sourced。

Answer 2

ReactJS 是一个用于构建 UI 组件层次结构的框架。每个组件都有状态和道具。数据通过 props 从顶层组件流向低层组件。使用事件处理程序在顶级组件中更新状态。

React native 使用 React 框架为移动应用程序构建组件。 React native 为 iOS 和 Android 平台提供了一组基本组件。 React Native 中的一些组件是 Navigator、TabBar、Text、TextInput、View、ScrollView。这些组件在内部使用原生 iOS UIKit 和 Android UI 组件。 React native 还允许使用 NativeModules，其中可以在 JavaScript.

中使用用 ObjectiveC 为 iOS 和 Java 为 Android 编写的代码

注意：React Native 作为框架允许使用与 HTML 和 CSS 类似的语法开发移动应用程序。 React Native 组件在原生开发中有效地替代了 HTML。

Answer 3

这里是 React project.

在 Facebook，他们发明了 React，因此 Java脚本可以使用虚拟 DOM 模型更快地操作网站 DOM。

DOM 与 React virtual-dom model 相比，完全刷新速度较慢，React virtual-dom model 仅刷新部分页面（阅读：部分刷新）。

你可能从这篇video中了解到，Facebook 并没有发明 React，因为他们立即意识到局部刷新会比传统刷新更快。最初，他们需要一种方法来减少 Facebook 应用程序的重新构建时间，幸运的是，这使部分 DOM 刷新变得栩栩如生。

React native 只是 React 的结果。这是一个使用 JavaScript.

构建本机应用程序的平台

在 React native 之前，您需要了解 Java 或 Kotlin for Android 以及 Swift 或 Objective-C for iPhone 和 iPad 创建本机应用程序。

使用 React Native 可以在 JavaScript 中模仿本机应用程序的行为，最后，您将获得特定于平台的代码作为输出。如果您需要进一步优化您的应用程序，您甚至可以将 本机代码 与 Java 脚本混合使用。

正如 Olivia Bishop 在 video 中所说，85% 的 React native 代码库可以在平台之间共享。这些将是应用程序通常使用的组件和通用逻辑。

15% 的代码是特定于平台的。特定于平台的 Java 脚本赋予了平台风味（并使体验有所不同）。

很酷的是这个特定于平台的代码 — 已经编写好了，所以您只需要使用它。

Answer 4

React Js 是一个 Javascript 库，您可以在其中使用 React 开发和运行更快的 Web 应用程序。

React Native 让您仅使用 JavaScript 构建移动应用程序，它用于移动应用程序开发。更多信息在这里 https://facebook.github.io/react-native/docs/getting-started.html

Answer 5

React-Native 是一个框架，其中 ReactJS 是一个 javascript 库，您可以将其用于您的网站。

React-native提供了默认的核心组件（图片、文本），而React提供了一堆组件，让它们协同工作。

Answer 6

React-Native 是一个用于开发 Android 和 iOS 应用程序的框架，它共享 80% - 90% 的 Javascript 代码。

而 React.js 是用于开发 Web 应用程序的父 Javascript 库。

虽然你在 React-Native 中经常使用 <View>、<Text> 等标签，但 React.js 使用网络 html 标签，如 <div> <h1> <h2>，它们只是 web/mobile 发展词典中的同义词。
对于 React.js 你需要 DOM 用于 html 标签的路径渲染，而对于移动应用程序：React-Native 使用 AppRegistry 来注册你的应用程序。

我希望这是对 React.js 和 React-Native 中快速 differences/similarities 的简单解释。

Answer 7

从简单的意义上讲，React 和 React native 遵循相同的设计原则，除了在设计用户界面的情况下。

React native 有一组单独的标签来定义用户移动界面，但都使用 JSX 来定义组件。
这两个系统的主要目的是开发可重用的 UI 组件并通过其组合减少开发工作量。
如果您正确规划和构建代码，您可以为移动和网络使用相同的业务逻辑

无论如何，它是为移动和网络构建用户界面的优秀库。

Answer 8

反应：

React is a declarative, efficient, and flexible JavaScript library for building user interfaces.

React Native:

React Native lets you build mobile apps using only JavaScript. It uses the same design as React, letting you compose a rich mobile UI from declarative components.
With React Native, you don't build a “mobile web app”, an “HTML5 app”, or a “hybrid app”. You build a real mobile app that's indistinguishable from an app built using Objective-C or Java. React Native uses the same fundamental UI building blocks as regular iOS and Android apps. You just put those building blocks together using JavaScript and React.
React Native lets you build your app faster. Instead of recompiling, you can reload your app instantly. With hot reloading, you can even run new code while retaining your application state. Give it a try - it's a magical experience.
React Native combines smoothly with components written in Objective-C, Java, or Swift. It's simple to drop down to native code if you need to optimize a few aspects of your application. It's also easy to build part of your app in React Native, and part of your app using native code directly - that's how the Facebook app works.

所以基本上 React 是 UI 用于 Web 应用程序视图的库，使用 javascript 和JSX、React native 是 React 之上的额外库，用于为 iOS 和 [=13= 制作原生应用程序] 设备。

React 代码示例：

import React, { Component } from 'react';
import ReactDOM from 'react-dom';

class Clock extends React.Component {
  constructor(props) {
    super(props);
    this.state = {date: new Date()};
  }

  componentDidMount() {
    this.timerID = setInterval(
      () => this.tick(),
      1000
    );
  }

  componentWillUnmount() {
    clearInterval(this.timerID);
  }

  tick() {
    this.setState({
      date: new Date()
    });
  }

  render() {
    return (
      <div>
        <h1>Hello, world!</h1>
        <h2>It is {this.state.date.toLocaleTimeString()}.</h2>
      </div>
    );
  }
}

ReactDOM.render(
  <Clock />,
  document.getElementById('root')
);

React Native 代码示例：

import React, { Component } from 'react';
import { Text, View } from 'react-native';

class WhyReactNativeIsSoGreat extends Component {
  render() {
    return (
      <View>
        <Text>
          If you like React on the web, you'll like React Native.
        </Text>
        <Text>
          You just use native components like 'View' and 'Text',
          instead of web components like 'div' and 'span'.
        </Text>
      </View>
    );
  }
}

有关 React 的更多信息，请访问由 facebook 团队创建的官方网站：

https://reactjs.org/

有关 React Native 的更多信息，请访问下面的 React native 网站：

https://reactnative.dev/

Answer 9

ReactJS 是一个核心框架，旨在构建基于反应模式的组件隔离，你可以将其视为 MVC 中的 V，尽管我想说 React 确实带来了不同的感觉，特别是如果你是不太熟悉反应式概念。

ReactNative 是另一层，旨在为通用的 Android 和 iOS 平台设置组件。所以代码看起来与 ReactJS 基本相同，因为它是 ReactJS，但它在移动平台上本地加载。您还可以根据 OS 将更复杂和平台相关的 API 与 Java/Objective-C/Swift 桥接起来，并在 React 中使用它。

Answer 10

React 是 React Native 和 React DOM 的基础抽象，所以如果你打算使用 React Native，你还需要 React...与网络相同，但你需要 React DOM.

而不是 React Native

由于 React 是基础抽象，所以一般语法和工作流程是相同的，但是您将使用的组件非常不同，因此您需要了解这些差异，这与 React 内联，即所谓的 moto "Learn once write anywhere" 因为如果你知道 React（基础抽象），你可以简单地了解平台之间的差异，而无需学习另一种编程语言、语法和工作流程。

Answer 11

React Native 主要是在 JavaScript 中开发的，这意味着您入门所需的大部分代码都可以跨平台共享。 React Native 将使用原生组件进行渲染。 React Native 应用程序以其目标平台所需的语言开发，Objective-C 或 Swift 代表 iOS，Java 代表 Android，等等。编写的代码不跨平台共享，它们的行为各不相同。他们可以不受任何限制地直接访问平台提供的所有功能。

React 是 Facebook 开发的用于构建用户界面的开源 JavaScript 库。它用于处理 Web 和移动应用程序的视图层。 ReactJS 用于创建可重用 UI components.It 目前是 it 领域最流行的 JavaScript 库之一，它有强大的基础和庞大的社区支持 it.If 你学习 ReactJS ，您需要了解 JavaScript、HTML5 和 CSS.

Answer 12

关于组件生命周期和所有其他花里胡哨的东西，它大部分是相同的。

主要区别在于使用的 JSX 标记。 React 使用类似于 html 的一个。另一个是 react-native 用来显示视图的标记。

Answer 13

React Native 用于移动应用程序，而 React 用于网站（前端）。两者都是 Facebook 发明的框架。 React Native 是一个跨平台开发框架，这意味着可以为 IOS 和 Android 编写几乎相同的代码并且它可以工作。我个人对 React Native 的了解要多得多，所以我就此打住。

Answer 14

React 是一个声明式的、高效的、灵活的 Java用于构建用户的脚本库 interfaces.Your 组件告诉 React 你想要渲染什么——然后 React 将有效地更新并渲染正确的组件您的数据发生变化。在这里，ShoppingList 是一个 React 组件 class，或者 React 组件类型。

React Native 应用程序是真正的移动应用程序。使用 React Native，您无需构建“移动 Web 应用程序”、“HTML5 应用程序”或“混合应用程序”。您构建了一个真正的移动应用程序，与使用 Objective-C 或 Java 构建的应用程序没有区别。 React Native 使用与常规 iOS 和 Android 应用程序相同的基本 UI 构建块。

More info

Answer 15

ReactJS 是一个 javascript 库，用于构建 Web 界面。您需要一个像 webpack 这样的捆绑器，并尝试安装构建网站所需的模块。

React Native 是一个 javascript 框架，它包含编写 multi-platform 应用程序所需的一切（如 iOS 或 Android）。您需要安装 xcode 和 android studio 才能构建和部署您的应用程序。

与 ReactJS 不同，React-Native 不使用 HTML，而是使用类似的组件，您可以跨 ios 和 android 来构建您的应用程序。这些组件使用真正的原生组件来构建 ios 和 android 应用程序。因此，React-Native 应用感觉不像其他混合开发平台那样真实。组件还提高了代码的可重用性，因为您不需要在 ios 和 android.

上再次创建相同的用户界面

Answer 16

REACT 是 Javascript 库，用于构建 large/small 界面 Web 应用程序，如 Facebook。

REACT NATIVE 是 Javascript 框架，用于在 Android、IOS 和 Windows Phone.[=12 上开发本机移动应用程序=]

两者均由 Facebook 开源。

Answer 17

以下是我所知道的差异：

它们有不同的 html 标签：React Native 用于处理文本，而不是在 React 中。
React Native 使用 Touchable 组件而不是常规按钮元素.
React Native 有用于渲染列表的 ScrollView 和 FlatList 组件。
React Native 使用 AsyncStorage 而 React 使用本地存储。
在 React Native 中路由器的功能是堆栈，而在 React 中，我们使用 Route 组件进行映射导航。

Answer 18

首先，相似之处： React 和 React Native (RN) 都旨在创建灵活的用户界面。这些框架有很多好处，但最基本的收获是它们是为 UI 开发而设计的。 Facebook 在 React 几年后开发了 RN。

反应： Facebook 设计这个框架几乎就像在你的 HTML/XML 中写你的 JavaScript，这就是为什么标签被称为“JSX”（JavaScript XML) 并且类似于熟悉的 HTML-like 标签，例如 <div> 或 <p>。 React 的标志是大写字母标签，它表示自定义组件，例如 <MyFancyNavbar />，它也存在于 RN 中。然而，React 使用 the DOM。 DOM 存在 HTML，因此 React 用于 Web 开发。

React Native: RN 不使用 HTML，因此不用于 Web 开发。它用于……几乎所有其他用途！移动开发（iOS 和 Android）、智能设备（例如手表、电视）、增强现实等。因为 RN 没有 DOM 可以交互，而不是使用相同的React 中使用的某种 HTML 标签，它使用自己的标签，然后将其编译成其他语言。例如，RN 开发人员使用 RN 的内置 <View> 标签而不是 <div> 标签，该标签在后台编译成其他本机代码（例如 Android 上的 android.view；和UIView iOS).

简而言之：它们非常相似（对于 UI 开发）但用于不同的媒介。

Answer 19

我们无法准确比较它们。用例.

存在差异
（2018 年更新）

ReactJS

React 主要关注 Web 开发。

React 的虚拟 DOM 比传统的完全刷新模型 更快，因为虚拟 DOM 只刷新页面的一部分。

您可以在 React 中重用代码组件，为您节省大量时间。（你也可以在 React Native 中。）

作为企业：从服务器到浏览器完全呈现您的页面将改善您的网络应用程序的搜索引擎优化。

它提高了调试速度让您的开发人员的生活更轻松。

您可以使用混合移动应用程序开发（如 Cordova 或 Ionic）通过 React 构建移动应用程序，但从许多方面来看，使用 React Native 构建移动应用程序效率更高。

React Native

React 的扩展，适合 移动开发。

它的主要重点是 移动用户界面。

iOS & Android 都覆盖了。

可重复使用 React Native UI 组件和模块 允许混合应用程序本地呈现。

无需彻底改造您的旧应用。您所要做的就是 将 React Native UI 组件添加到现有应用程序的代码中，而无需重写。

不使用 HTML 呈现应用程序。提供以类似方式工作的替代组件，因此不难理解它们。

因为您的代码不会在 HTML 页面中呈现，这也意味着您 将无法重用您之前在 React 中使用的任何库呈现任何类型的 HTML、SVG 或 Canvas.

React Native 不是由网络元素构成的，不能以相同的方式设置样式。 再见CSS动画！

希望对你有所帮助:)

Answer 20

reactjs 使用 react-dom 而不是浏览器 dom 而 react native 使用 virtual dom 但两者使用相同的语法，即如果你可以使用 reactjs 那么你可以使用react native.because 你在 reactjs 中使用的大多数库都可以在 react native 中使用，比如你的 react 导航和它们共有的其他公共库。

Answer 21

总结：React.js 用于 Web 开发，而 React-Native 用于移动应用程序开发

Answer 22

简单来说 ReactJS 是父库，它 returns 根据主机环境（浏览器、移动设备、服务器、桌面等）呈现的东西。除了渲染，它还提供了其他方法，如生命周期钩子..等

在浏览器中，它使用另一个库 react-dom 来渲染 DOM 元素。在移动设备中，它使用 React-Native 组件来呈现平台特定（IOS 和 Android）原生 UI 组件。所以，

react + react-dom = 网络开发

react + react-native = 移动开发

Answer 23

React Js 正在使用 HTML Dom 进行操作。但是 React native 正在使用 mobile(iOS/android) native ui 组件进行操作。

Answer 24

React Js - React JS 是 front-end javascript 库它是一个大型库而不是框架

它遵循有助于构建的基于组件的方法
可重用 UI 组件
- 用于开发复杂的交互式网络和移动设备UI
- 尽管它在 2015 年才 open-sourced，但它拥有支持它的最大社区之一。

ReactNative - React Native 是一个 open-source 移动应用程序框架。

Answer 25

React Native

它是一个使用JavaScript构建原生应用程序的框架。
它编译为原生应用程序组件，这使您可以构建原生移动应用程序。
无需彻底改造您的旧应用。你所要做的就是添加 React 将本机 UI 组件添加到您现有应用程序的代码中，而无需重写。

React js

它同时支持前端网络和在服务器上运行，对于构建用户界面和 Web 应用程序。
它还允许我们创建可重用的 UI 组件。
你可以在 React JS 中复用代码组件，节省你很多时间。

Answer 26

回应上面的评论，这里是之前在React中发布的Clock代码的React Native版本（抱歉，我无法直接评论该部分，否则我会添加那里的代码）：

React Native 代码示例

import { AppRegistry } from 'react-native';
import React, { Component } from 'react';
import { View, Text, StyleSheet } from 'react-native';

class Clock extends Component {
  constructor(props) {
    super(props);
    this.state = { date: new Date() };
  }

  componentDidMount() {
    this.timerID = setInterval(
      () => this.tick(),
      1000
    );
  }

  componentWillUnmount() {
    clearInterval(this.timerID);
  }

  tick() {
    this.setState({
      date: new Date()
    });
  }

  render() {
    return (
      <View style={styles.container}>
        <Text style={styles.sectionTitle}>Hello, world!</Text>
        <Text style={styles.sectionDescription}>It is {this.state.date.toLocaleTimeString()}.</Text>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    backgroundColor: 'white',
    flex: 1,
    justifyContent: 'center',
  },
  sectionTitle: {
    fontSize: 24,
    fontWeight: '600',
    color: 'black',
    alignSelf: 'center',
  },
  sectionDescription: {
    marginTop: 8,
    fontSize: 18,
    fontWeight: '400',
    color: 'darkgrey',
    alignSelf: 'center',
  },
});

AppRegistry.registerComponent("clock", () => Clock);

请注意，样式完全是我的选择，并不试图直接复制 React 代码中使用的 <h1> 和 <h2> 标签。

Answer 27

部分差异如下：
1- React-Native 是一个用于创建移动应用程序的框架，其中 ReactJS 是一个 javascript 库，您可以将其用于您的网站。
2- React-Native 不使用 HTML 来呈现应用程序，而 React 使用。
3- React-Native 仅用于开发移动应用程序，而 React 用于网站和移动应用程序。

Answer 28

晚会有点晚了，但这里有一个更全面的示例答案：

反应

React 是一个基于组件的 UI 库，它使用“影子 DOM” 来有效地更新 DOM 的内容，而不是重建整个 DOM每次更改的树。它最初是为网络应用程序构建的，但现在也可用于移动和 3D/VR。

React 和 React Native 之间的组件不能互换，因为 React Native 映射到原生移动 UI 元素，但可以重复使用业务逻辑和非渲染相关代码。

反应DOM

最初包含在 React 库中，但在 React 用于其他平台而不仅仅是 Web 时被拆分出来。它作为 DOM 的入口点，并与 React 联合使用。

示例：

import React from 'react';
import ReactDOM from 'react-dom';

class App extends Component {
    state = {
        data: [],
    }

    componentDidMount() {
        const data = API.getData(); // fetch some data
        this.setState({ data })
    }

    clearData = () => {
        this.setState({
            data: [],
        });
    }

    render() {
        return (
            <div>
                {this.state.data.map((data) => (
                    <p key={data.id}>{data.label}</p>
                ))}
                <button onClick={this.clearData}>
                    Clear list
                </button>
            </div>
        );
    }

}

ReactDOM.render(App, document.getElementById('app'));

React Native

React Native 是一个跨平台的移动框架，它使用 React 并通过“桥”在 Javascript 和它的原生对应物之间进行通信。因此，在使用 React Native 时，许多 UI 结构必须有所不同。例如：在构建列表时，如果您尝试使用 map 而不是 React Native 的 FlatList 来构建列表，您将运行陷入主要的性能问题。 React Native 可用于构建 IOS/Android 移动应用程序，以及智能手表和电视。

世博会

Expo 是启动新的 React Native 应用程序的首选。

Expo is a framework and a platform for universal React applications. It is a set of tools and services built around React Native and native platforms that help you develop, build, deploy, and quickly iterate on iOS, Android, and web apps

注意：使用Expo时，只能使用他们提供的NativeApi。您包含的所有其他库都需要是纯库 javascript 否则您将需要弹出 expo.

使用 React Native 的相同示例：

import React, { Component } from 'react';
import { Flatlist, View, Text, StyleSheet } from 'react-native';

export default class App extends Component {
    state = {
        data: [],
    }

    componentDidMount() {
        const data = API.getData(); // fetch some data
        this.setState({ data })
    }

    clearData = () => {
        this.setState({
            data: [],
        });
    }

    render() {
        return (
            <View style={styles.container}>
                <FlatList
                    data={this.state.data}
                    renderItem={({ item }) => <Text key={item.id}>{item.label}</Text>}
                />
                <Button title="Clear list" onPress={this.clearData}></Button>
            </View>
        );
    }

}

const styles = StyleSheet.create({
    container: {
        flex: 1,
    },
});

差异：

请注意，渲染之外的所有内容都可以保持不变，这就是业务 logic/lifecycle 逻辑代码可以跨 React 和 React Native
在 React Native 中，所有组件都需要从 react-native 或另一个 UI 库中导入
使用某些映射到本机组件的 API 通常比尝试在 javascript 端处理所有内容更高效。前任。映射组件以构建列表与使用 flatlist
细微差别：onClick 变成了 onPress，React Native 使用样式表以更高效的方式定义样式，而 React Native 使用 flexbox 作为默认布局结构来保持响应.
由于 React Native 中没有传统的“DOM”，因此只能跨 React 和 React Native 使用纯 javascript 库

React360

另外值得一提的是，React 也可以用来开发 3D/VR 应用程序。组件结构与 React Native 非常相似。 https://facebook.github.io/react-360/

Answer 29

简单的 React Js 适用于 Web React Native 适用于跨平台移动应用程序！

Answer 30

ReactJS

React 用于创建网站、网络应用程序、SPA 等
React 是一个 Javascript 库，用于创建 UI 层次结构。
负责渲染UI个组件，被认为是MVC框架的V部分。
React的virtualDOM比传统的full refresh模型更快，因为virtualDOM只刷新部分页面，从而减少了页面刷新时间。
React 使用组件作为 UI 的基本单元，可以重复使用这节省了编码时间。简单易学。

React Native
React Native 是一个用于创建跨平台原生应用程序的框架。这意味着您可以创建本机应用程序，并且同一应用程序将运行 Android 和 ios。
React native 拥有 ReactJS 的所有优点
React native 允许开发人员以 web 风格的方式创建原生应用程序。

Answer 31

React 是一个用于构建用户界面的 JavaScript 库。它用于重用 UI 个组件。 React Native 是一个 JavaScript 框架，用于为 iOS 和 Android 编写真实的、本地呈现的移动应用程序。两者都是由 facebook 开发的，它们共享相同的生命周期方法。

Answer 32

我知道已经有很多答案了，但是在阅读了所有这些之后，我觉得没有人解释这两者之间的架构差异是什么以及这两者是如何工作的，所以我相信还有解释的余地。

反应

React = Vanilla JS + ES6 + HTML + CSS = JSX = Web Apps（前端）

所以先说React因为React-Native也是基于react并且那里使用了相同的 JS 概念。

React 是一个 JS 库，用于制作美观、灵活、高效 单页 Web 应用程序, 那么现在你的脑海里就会出现一个问题什么是单页web应用.

单页应用程序

单页应用程序是在浏览器中运行的应用程序，在使用过程中不需要重新加载页面。您每天都在使用这些类型的应用程序。例如：Gmail、Google 地图、Facebook 或 GitHub。 SPA 旨在通过尝试在浏览器中模仿“自然”环境来提供出色的用户体验——无需重新加载页面，无需额外的等待时间。它只是您访问的一个网页，然后使用 JavaScript 加载所有其他内容——他们严重依赖它。 SPA 独立请求标记和数据并直接在浏览器中呈现页面。我们可以做到这一点要归功于高级 Java 脚本框架，例如 AngularJS、Ember.js、Meteor.js、Knockout.js、React.js、Vue.js . 单页网站有助于让用户保持在一个舒适的网络中 space，其中内容以简单、容易且可行的方式呈现给用户。

工作原理

现在您知道什么是 SPA，正如您所知，它是一个 Web 应用程序，因此它将使用 HTML 元素运行进入浏览器，并使用 JS 处理所有相关功能对这些元素。它使用 Virtual DOM 呈现组件中的新变化。

React-Native

现在你对 react 有了一些了解，那么让我们谈谈 react-native

React-Native = React (Vanilla JS + ES6 + JS 和 Native 代码之间的桥梁) + Native(iOS, Android) = Mobile Apps(Android, iOS, 也支持 web 但有一些限制)

React-Native 用于使用 React 制作精美的跨平台移动应用程序（Android、iOS）。

工作原理

在 React-Native 中有两个线程。

JS 线程
本机线程

所有 React 代码都在 JS 线程 中执行，最终值传递给 本机线程，后者在显示最终值的屏幕。

JS 线程执行所有计算并将数据传递给本机，如何？

React 使用 Async Bridge 以 JSON 格式向 Native 线程传递数据称为 React-Native

所以我们使用 Native 组件在 react-native 中制作展示视图，并使用该桥梁在这两个不同的世界之间进行通信。

JS 线程足够快来执行 JavaScript 并且本机线程也足够快来执行本机代码但是由于 React 使用异步桥在这两个世界之间进行通信，过载这个桥会导致性能问题.

更新： React-Native 现在正在经历重构阶段，facebook 团队正试图移除异步桥以在 JS 和本机之间同步通信，这个重构的主要部分是 JSI（Javascript 接口）和 fabirc。

JSI: JSI 消除了在 Native(Java/ObjC) 和 Javascript 代码之间建立桥梁的需要。它还删除了对 serialize/deserialize 所有信息的要求，如 JSON 用于两个世界之间的通信。 JSI 通过关闭 javascript 和本地世界打开通往新可能性的大门。

以下是 JSI 提供的主要内容。

Javascript 接口允许我们用Javascript 运行时间注册方法。这些方法可通过 Java 脚本世界中的全局对象获得。
这些方法可以完全用 C++ 编写，也可以是与 iOS 上的 Objective C 代码和 [=157 中的 Java 代码进行通信的一种方式=].
任何当前使用传统桥在 Java 脚本和本地世界之间进行通信的本地模块都可以通过在 C++ 中编写一个简单的层来转换为 JSI 模块在 iOS 上编写这一层很简单，因为 C++ 可以运行直接在 Objective C 中，因此所有 iOS 框架和代码都可以直接使用。
在 android 上，但是我们必须加倍努力才能通过 JNI 做到这一点。
这些方法可以完全同步，这意味着使用 async/await 不是强制性的。

Fabric: Fabirc 是一个新的 UI 层，它允许我们与本地 UI 组件同步通信，根据 docs.

Fabric is React Native's new rendering system, a conceptual evolution of the legacy render system. The core principles are to unify more render logic in C++, improve interoperability with host platforms, and to unlock new capabilities for React Native. Development began in 2018 and in 2021, React Native in the Facebook app is backed by the new renderer.

我们来谈谈这两个框架的共同点和不同点。

Feature	React	React-Native
Platform	Web	Android, IOS, Web
Open Source	Yes	Yes
User Interface	HTML + CSS	Native Components(iOS, Android, Web)
Architecture	Virtual DOM	Virtual DOM + Bridge + Native implementation
Animations	CSS Animations	Native Animations
Styling	CSS	JS Stylesheets
Developed By	Facebook	Facebook

Answer 33

简单比较应该是

ReactJs

return(
    <div>
      <p>Hello World</p>
    </div>
)

React Native

return(
    <View>
      <Text>Hello World</Text>
    </View>
)

React Native 没有 Html 元素，例如 div、p、h1 等，而是具有对移动设备有意义的组件。
更多详情请见 https://reactnative.dev/docs/components-and-apis

Answer 34

React 用于在浏览器中运行的 Web 应用程序。 React Native 用于 android 和 IOS 在移动应用程序中工作的应用程序。

Answer 35

React 本质上是由 Facebook 拥有和开发的。它实际上是在 2013 年进入技术世界的。React 是一个 JS 库，而不是框架。 React 最了不起的一点是它可以同时创建前端和后端。

React NATIVE 只是一个移动开发 platform.Prior 到 React native 你需要知道 Java for Android or Objective-C for iPhone and iPad to create native React app.: 简而言之，React是Webdev技术，React-Native是mobildev技术。

Answer 36

React-Native 是一个 cross-platform 使用 reactjs 为所有平台使用相同代码构建应用程序，例如 (iOS, Android, Web, Windows, Mac, Linux).

实现的区别在于 reactjs 使用 HTML 标签，而 react-native 使用 react-native 特定组件。

Answer 37

它是用于 OS 和 android 应用程序开发的混合工具。您不必两次编写代码。它使用本机组件和 React。它还为您提供对服务器 (firebase) 的访问权限。如需进一步帮助，请点击以下链接： https://reactnative.dev/ https://nativebase.io/

Answer 38

React 是使用 JavaScript 构建应用程序的框架。 React Native 是一个完整的平台，允许您构建原生的 cross-platform 移动应用程序，而 React.js 是一个 JavaScript 库，可用于构建高性能 UI 层。 React.js 是 React Native 的核心，它体现了 React 的所有原则和语法，因此学习起来很容易。平台是导致他们技术差异的原因。就像 React 中的浏览器代码是通过 Virtual DOM 呈现的，而 React Native 使用 Native API 在移动设备上呈现组件。 React 使用 HTML 和 React Native，您需要熟悉 React Native 语法。 React Native 也不使用 CSS。这意味着您必须使用 React Native 附带的动画 API 来为应用程序的不同组件设置动画。

最重要的是，React 是构建动态、高性能、响应式 Web 界面的理想选择 UI，而 React Native 旨在为您的移动应用程序提供真正的原生感觉。

参考：what-is-the-difference-between-react-js-and-react-native

Answer 39

React Native 是一个 JavaScript 框架，它包含编写 multi-platform 应用程序所需的一切（如 iOS 或 Android）.

ReactJS 是一个 JavaScript 库，用于构建 Web 界面和构建您的网站。

Answer 40

在 Reactjs 中，虚拟 DOM 用于在 Reactjs 中呈现浏览器代码，而在 React Native 中，本机 API 用于在移动中呈现组件。

用Reactjs开发的应用程序在UI中渲染HTML，而React Native使用JSX渲染UI，这只不过是javascript。

Answer 41

React Native 是一个开源移动应用程序框架。
React JS 是前端 javascript 库它是一个大型库而不是框架。

Answer 42

这里有一个很好的解释：

Reactjs is a JavaScript library that supports both front-end and server. Furthermore, it can be used to create user interfaces for mobile apps and websites.

React Native is a cross-platform mobile framework that uses Reactjs for building apps and websites. React Native compiles to native app components enables the programmer to build mobile applications that can run on different platforms such as Windows, Android, iOS in JavaScript.

Reactjs 可以描述为 React DOM 的基础衍生品，对于 Web 平台，而 React Native 本身就是基础衍生品，这意味着语法和工作流程保持不变, 但组件改变了。
Reactjs 最终是一个 JavaScript 库，它使程序员能够创建一个引人入胜且高性能的 UI 层，而 React Native 是一个用于构建交叉的完整框架- 平台应用程序，无论是 Web、iOS 还是 Android.
在Reactjs中，虚拟DOM用于在Reactjs中渲染浏览器代码，而在React Native中，原生APIs用于在移动中渲染组件。
用Reactjs开发的应用在UI中渲染HTML，而React Native使用JSX渲染UI，无非是javascript。
CSS 用于在 Reactjs 中创建样式，而样式表用于 React Native 中的样式。
在 Reactjs 中，动画是可能的，使用 CSS，就像 Web 开发一样，而在 React Native 中，动画 API 用于在不同组件之间诱导动画React Native 应用程序。
如果需要为 Web 界面构建高性能、动态和响应式 UI，那么 Reactjs 是最佳选择，而如果需要为移动应用程序提供真正的原生的感觉，那么React Native是最好的选择。

更多信息：https://www.simform.com/reactjs-vs-reactnative/

Answer 43

React Native 是一个使用 React 构建 android 和 ios 应用程序的框架。 React 是一个用于构建出色网站的 Web 框架。

Answer 44

区别很简单。

We use React for web apps, and React Native to develop mobile apps.

React 更侧重于改进 UI（用户界面），而 RN 为所有 OS 共享一个公共逻辑层。这为现在已经处理了很长一段时间的问题提供了解决方案，例如开发效率低下、部署时间较慢以及开发人员生产力较低。

需要注意的是，React 是一个用于 Web 开发的库，而 React Native 是一个平台。

另一件有趣的事情是，当你想使用 RN 时，你拥有启动项目所需的一切。另一方面，使用 React 创建一个新项目意味着您只选择了构建 Web 应用程序必须使用的众多库中的一个。

您可以在那篇文章中找到更多有用的信息： https://pagepro.co/blog/react-native-faq-all-you-need-to-know

Answer 45

React 和 React-native 之间的主要区别是 React 带有基于 Web 的 UI 组件，而 React native 带有与移动相关的 UI 小部件，其余一切几乎相似。

React Native 和 React 有什么区别？

What is the difference between React Native and React?

javascript

javascript-framework

reactjs

react-native

ReactJS

React Native

反应

反应DOM

React Native

世博会

差异：

React360