ReactNative

组件

View - 这是所有其他组件的容器，类似于 HTML 中的 <div> 标签。它用于布局和样式化。
Text - 用于显示文本。它支持文本样式，如字体大小、颜色、对齐等。
Image - 用于显示图片。它支持本地图片、网络图片以及静态图片资源。
```
<Image source={require('./img/check.png')} />
```
require iPhone 7 会使用check@2x.png，而 iPhone 7 plus 或是 Nexus 5 上则会使用check@3x.png。

uri:可以发生请求或者做一些缓存，uri可以请求也可以使用base64
TextInput - 用于创建文本输入框，允许用户输入文本。
Button - 用于创建按钮，可以响应用户的点击事件。
ScrollView - 用于创建可滚动的视图，当内容超出屏幕时可以滚动查看。
FlatList - 用于显示一个滚动列表，适用于大量数据的展示，性能比 ScrollView 更好。

且元素个数可以增删。和ScrollView不同的是，FlatList并不立即渲染所有元素，而是优先渲染屏幕上可见的元素。

必须的两个属性是data和renderItem。data是列表的数据源，而renderItem则从数据源中逐个解析数据，然后返回一个设定好格式的组件来渲染。

确保： 避免自适应高度使用getItemLayout，一个可选的优化。
SectionList - 类似于 FlatList，但用于展示分组的数据。
Modal - 用于创建模态对话框，可以覆盖在其他视图之上。
Switch - 用于创建开关控件，允许用户切换开/关状态。
StatusBar - 用于控制状态栏的样式，如颜色、透明度等。
ActivityIndicator - 用于显示加载动画，通常在数据加载时使用。
TouchableHighlight - 用于创建可触摸的视图，当用户触摸时会有视觉反馈。
TouchableOpacity - 类似于 TouchableHighlight，而是改变透明度。
TouchableWithoutFeedback - 用于创建可触摸的视图，但不会提供任何视觉反馈。
ListView - 用于创建列表视图，但已被 FlatList 和 SectionList 替代。
ActivityIndicator - 用于显示加载动画，通常在数据加载时使用。
SafeAreaView - 用于确保内容在安全区域内显示，避免被设备的非显示区域（如刘海屏、凹口等）遮挡。
DrawerLayoutAndroid - 用于创建侧滑菜单，仅限于 Android 平台。
TabView - 用于创建标签页视图。
Picker - 用于创建选择器，允许用户从预定义的选项中选择。
ProgressViewIOS - 用于创建进度条，仅限于 iOS 平台。
SegmentedControlIOS - 用于创建分段控件，仅限于 iOS 平台。
WebView - 用于嵌入网页内容。

事件 8

onPress：触摸屏幕并释放时触发。
onLongPress：触摸并保持一段时间后触发。
onPressIn 和 onPressOut：触摸屏幕并开始或结束时触发。
onChangeText：文本输入框内容变化时触发。 //
onSubmitEditing：文本输入框内容提交时触发。 //
onScroll：滚动视图时触发。
onLayout：组件布局变化时触发。
onValueChange：滑块（Slider）值变化时触发。

react native性能优化

避免不必要的渲染：
- 使用 React.memo 或 shouldComponentUpdate 来避免不必要的组件渲染。
- 使用 PureComponent 或 React.memo 来进行浅比较，避免不必要的重新渲染。
优化列表渲染：
- 使用 FlatList 或 SectionList 替代 ScrollView 来渲染长列表，因为它们可以只渲染可视区域内的元素。
- 为列表项提供唯一的key 属性，帮助 React Native 识别哪些元素是新的或已更改的。
减少图片大小：
- 使用 Image 组件的 resizeMode 属性来控制图片的缩放方式，避免不必要的图片加载。
  - resizeMode 属性接受以下几种值：
    1. contain (默认值):保持其原始宽高比，同时尽可能地放大或缩小以适应容器的尺寸，有空白。
    2. cover:保持其原始宽高比，会缩放以完全覆盖其容器。但不留下空白。
    3. stretch：图片会被拉伸以完全填充其容器的尺寸，图片的宽高比不会被保持。
    4. repeat：图片会被重复填充其容器的尺寸。
    5. center：保持其原始尺寸，并在容器中居中显示。
- 使用 Image.prefetch 预加载图片，以减少首次渲染时的加载时间。
使用原生模块：使用原生代码（如 Java/Kotlin 对于 Android，Swift/Objective-C 对于 iOS）来实现，然后通过 React Native 的桥接机制与 JavaScript 交互。
避免复杂的样式计算：
- 使用 StyleSheet.create 来定义样式，这样可以减少样式计算的开销。
- const styles = StyleSheet.create({}) <Text style={styles[this.state.backgroundColor]}>

HermesInternal

可用于验证是否正在使用 Hermes

const isHermes = () => !!global.HermesInternal;

动画

用于创建精细的交互控制的动画Animated和用于全局的布局动画LayoutAnimation。

多个动画可以通过parallel（同时执行）、sequence（顺序执行）、stagger和delay来组合使用

Platform 模块

js中可以使用Platform.OS在 iOS 上会返回ios，而在 Android 设备或模拟器上则会返回android。

css中可以如下：

import {Platform, StyleSheet} from 'react-native';

const styles = StyleSheet.create({
  container: {
    flex: 1,
    ...Platform.select({
      ios: {
        backgroundColor: 'red',
      },
      android: {
        backgroundColor: 'blue',
      },
    }),
  },
});

pushy

热更新

样式

驼峰命名法，建议styleSheet.create集中创建，{styles.name}， [多个]，{{直接设置属性}}

Flex Direction

column（默认值）：将子元素从上到下对齐。如果启用换行，则下一行将从容器顶部的第一个项目右侧开始。
row：将子元素从左到右对齐。如果启用换行，则下一行将在容器左侧的第一个项目下方开始。
column-reverse：将子元素从底部向上对齐。如果启用换行，则下一行将从容器底部的第一个项目右侧开始。
row-reverse：将子元素从右到左对齐。如果启用换行，则下一行将在容器右侧的第一个项目下方开始。

<PreviewLayout
      label="direction"
      selectedValue={direction}
  //ltr文本和子元素从左到右进行排列,rtl文本和子元素从右到左进行排列
      values={["ltr", "rtl"]} 
      setSelectedValue={setDirection>
  </PreviewLayout>

alignSelf（布局属性#alignself）与 alignItems 具有相同的选项和效果，但不是影响容器内的子元素，可以将此属性应用于单个子元素以更改其在父级中的对齐方式

怎么实现react native和原生交互

原生UI组件

// ios在Objective-C中创建一个原生UI组件
// android在 java中创建一个原生UI组件
import { requireNativeComponent } from 'react-native';
const MyNativeView = requireNativeComponent('MyNativeView');

原生模块

// ios在Objective-C中原生模块
// android在 java中写原生模块

import { NativeModules } from 'react-native';

const { MyNativeModule } = NativeModules;

MyNativeModule.sayHello('World', (response) => {
  console.log(response);
});

原生事件允许原生代码向JavaScript发送事件

// ios在Objective-C中创建一个事件发射器
// android在 java中事件发射器
import { NativeEventEmitter, NativeModules } from 'react-native';

const { MyNativeModule } = NativeModules;
const eventEmitter = new NativeEventEmitter(MyNativeModule);

const subscription = eventEmitter.addListener('MyEventName', (event) => {
  console.log(event);
});

// 记得在组件卸载时移除监听器
return () => {
  subscription.remove();
};

如何调用相机

react-native-camera 库（包含了android的依赖
对于iOS，链接原生模块到你的项目，cd ios && pod install
<RNCamera>

React 元素树

由 React 元素组成。一个 React 元素就是一个普通的 JavaScript 对象，它描述了应该在屏幕中展示什么类：React 复合组件实例和 React 宿主组件实例

React 影子树

通过 Fabric 渲染器创建的，由影子节点组成。一个影子节点是一个对象，代表一个已经挂载的 React 宿主组件，其包含的属性，它也包括布局信息；

Yoga 树

用来计算反应影子树的布局信息。每个影子树节点通常都会创建一个瑜伽节点，因为React Native使用瑜伽来计算布局。

Fabric

用 C++ 实现的，使用JSI在 Fabric 的 C++ 核心和 React 之间进行通信，Fabric 使用异步渲染模型。允许你在 React Native 使用 React Concurrent 可中断渲染功能。

java native interface(JNI

一个用于在 Java 中写原生方法的 API。作用是实现 Fabric 的 C++ 核心和 Android 的通信。

渲染流水线

渲染（Render）：React 执行创建元素树（React Element Trees）。在 C++ 中，用元素树创建影子树（React Shadow Tree）。
提交（Commit）：影子树创建后，渲染器会触发一次提交。将元素树和新创建的影子树的提升为“下一棵要挂载的树”。也包括了布局信息计算。
挂载（Mount）：影子树有了布局计算结果后，会转化为一个宿主视图树（Host View Tree）。

跨平台的实现

在上一代 React Native 渲染器中，React 影子树、布局逻辑、视图拍平算法是在各个平台单独实现的。

使用 C++ 作为核心渲染系统有几个要点。降低了开发和维护成本。每个 React 影子节点在 C++ 中占用的内存，比在 Kotlin 或 Swift 中占用的要小。

但在 Android 端还有两种例外，渲染器依然会有 JNI 的开销：

复杂视图，比如 Text、TextInput 等，依然会使用 JNI 来传输属性 props。
在挂载阶段依然会使用 JNI 来发送变更操作。

索使用 ByteBuffer 序列化数据这种新的机制，来替换 ReadableMap，减少 JNI 的开销。目标是将 JNI 的开销减少 35~50%。

视图拍平

避免布局嵌套太深的优化手段

webview和rn实现通信

这可以通过 WebView 提供的 injectJavaScript 方法和 onMessage 事件来实现。

Window.ReactNativeWebView.potMessage();

import React, { useRef } from 'react';
import { WebView } from 'react-native-webview';

const App = () => {
  const webViewRef = useRef(null); // 

  const sendMessageToWebView = () => {
    if (webViewRef.current) {
      webViewRef.current.injectJavaScript(`
        // 这里是你的 JavaScript 代码
        window.ReactNativeWebView.postMessage('Hello from React Native!');
      `);
    }
  };
  return (
    <View style={{ flex: 1 }}>
      <WebView
        ref={webViewRef}
        source={{ uri: 'https://example.com' }}
        onMessage={(event) => {
    				console.log('Received message from WebView:', event.nativeEvent.data);
  			}}
      />
      <Button title="Send Message to WebView" onPress={sendMessageToWebView} />
    </View>
  );
};

// 在你的网页中
window.addEventListener('message', function(event) {
  // 检查消息来源是否可信
  if (event.origin === '你的应用的协议://你的应用的域名') {
    // 发送消息给 React Native
    window.ReactNativeWebView.postMessage('Hello from WebView!'); //发送
  }
});

渲染流程

用户触发交互事件，React 组件的 render 方法被调用，生成新的虚拟 DOM 树。
使用 diff 算法比较新旧虚拟 DOM 。确定哪些组件需要更新。
通过桥街方式将虚拟 DOM 树映射到原生组件树。
根据映射结果，会更新发送变化的原生视图树。
更新完成后，会进行布局计算，确定每个视图的位置和尺寸。
将视图渲染到屏幕上。

React native有几个线程，分别负责什么工作，有阻塞关系

主线程（UI线程）：

负责处理用户界面的渲染和响应用户输入。
执行 JavaScript 代码，包括事件处理、状态更新和组件渲染。
与原生模块通信，如调用原生模块的方法或获取原生模块的数据。

JavaScript线程（也称为JS线程或主线程）：

通常与主线程是同一个线程，但在某些情况下，React Native 可以使用单独的线程来执行 JavaScript 代码。
负责执行 JavaScript 代码，包括应用的业务逻辑、状态管理、组件渲染等。
与主线程通过桥接（Bridge）通信，将 JavaScript 的操作转换为原生操作

原生线程：

负责执行原生代码，如原生模块的实现、UI渲染、网络请求等。
与主线程通过桥接（Bridge）通信，将原生操作的结果反馈给 JavaScript 线程。

阻塞关系

JavaScript 线程对主线程的阻塞：执行长任务时，它会阻塞主线程，导致 UI 更新延迟。这是因为 JavaScript 线程和主线程是串行执行的，JavaScript 线程在执行时会占用主线程的执行时间。
主线程对 JavaScript 线程的阻塞：当主线程执行耗时的原生操作时，如复杂的 UI 渲染或网络请求，它会阻塞 JavaScript 线程，导致 JavaScript 代码的执行延迟。

为了减少这种阻塞，React Native 采取了以下措施：

异步执行：对于耗时的原生操作，如网络请求，React Native 通常会异步执行这些操作，以避免阻塞主线程。
分批处理：对于需要在主线程上执行的 JavaScript 代码，React Native 会尝试将它们分批处理，以减少对主线程的阻塞。
使用 Fabric 架构：React Native 0.61 引入了 Fabric 架构，旨在通过使用新的渲染引擎来减少主线程的阻塞。Fabric 架构通过在主线程上使用原生视图组件来提高渲染性能，从而减少主线程的阻塞。

appRegistry的作用

在 AppRegistry` 是 React Native 应用的注册中心，它允许开发者定义应用的入口组件，并且可以启动应用的根组件。

AppRegistry 的主要作用包括：

注册应用：开发者需要使用 AppRegistry.registerComponent 方法来注册应用的根组件。这个方法接受两个参数：第一个参数是应用的名称（字符串），第二个参数是应用的根组件（React 组件）。
启动应用：一旦应用被注册，就可以使用 AppRegistry.runApplication 方法来启动应用。这个方法接受两个参数：第一个参数是应用的名称，第二个参数是一个配置对象，其中可以包含应用的初始状态等信息。
处理应用的生命周期：AppRegistry 还负责处理应用的生命周期事件，如应用的挂载、卸载等。开发者可以通过监听这些事件来执行特定的代码。
支持热重载：在开发过程中，AppRegistry 支持热重载（Hot Reloading），这意味着当开发者修改代码并保存时，应用可以重新加载更改的部分，而不需要重新启动整个应用。这大大提高了开发效率。
支持多应用：AppRegistry 支持在一个应用中注册和运行多个不同的应用。这在开发多页面应用或需要在同一个应用中运行多个独立组件时非常有用。

下面是一个简单的例子，展示了如何使用 AppRegistry：

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

class MyApplication extends React.Component {
  render() {
    return <Text>Hello, world!</Text>;
  }
}

// 注册应用
AppRegistry.registerComponent('MyApplication', () => MyApplication);

// 启动应用
AppRegistry.runApplication('MyApplication', {
  initialProps: {}, // 可选的初始属性
  rootTag: document.getElementById('react-root'), // 可选的根标签
});

桥接机制的工作原理

JavaScript 到原生：

当 JS 需要执行一个原生操作时，通过桥接层发送一个消息到原生端，并将其放入原生端的消息队列中。
原生端的线程会定期检查消息队列，并执行相应的操作。
执行完毕后，原生代码会通过桥接层将结果返回。

原生到 JavaScript：

当原生代码需要通知 JS ，它会将事件信息发送到桥接层。
将事件信息转换为 JS 可以处理的格式。
JS 代码处理这些事件，并根据需要更新 UI。

桥接层是如何处理内存泄漏的？

使用 JavaScript 的垃圾回收机制来管理内存。
在原生代码中，使用引用计数来管理内存。例如，在 iOS 上，使用 Objective-C 的引用计数机制来跟踪对象的引用数量。当对象的引用数量降到零时，对象会被自动释放。
生命周期管理：
内存泄漏检测工具：React Native 提供了内存泄漏检测工具，如 React Native Debugger 和 Chrome DevTools
数据传递过程中不会产生循环引用，因为循环引用会导致内存泄漏。
使用不可变数据结构
避免全局变量：全局变量不会被垃圾回收机制回收，除非显式地将其设置为 null。
hook

React native怎么打包

Android

1.确保你已经安装了所有必要的依赖：

安装 JDK
安装 Android Studio
设置 ANDROID_HOME 环境变量
安装 Android SDK 并创建至少一个虚拟设备（AVD）

2.在项目根目录下运行以下命令：

npx react-native run-android

3.打包 APK：

生成一个bundle文件，包含JavaScript代码和资源文件，android/app/src/main/assets/

npx react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res/

然后，使用 Android Studio 打开项目，Build->Build Bundle(s) / APK(s)->Build APK(s)，并构建 APK。

iOS

1.确保你已经安装了所有必要的依赖：

安装 Xcode
安装 CocoaPods（如果使用）

2.在项目根目录下运行以下命令：

npx react-native run-ios

3.打包 IPA：

生成一个bundle文件，包含JavaScript代码和资源文件， ios/
```
npx react-native bundle --platform ios --dev false --entry-file index.js --bundle-output ios/main.jsbundle --assets-dest ios
```
- --platform android：指定平台为 Android。
- --dev false：关闭开发模式，这会减少 bundle 的大小并提高应用的性能。
- --entry-file index.js：指定入口文件，这是应用的主 JavaScript 文件。
- --bundle-output android/app/src/main/assets/index.android.bundle：指定 bundle 文件的输出路径。
- --assets-dest android/app/src/main/res/：指定资源文件（如图片、字体等）的输出路径。
然后，使用 Xcode 打开项目，Product->Archive[ˈɑrkaɪv]，弹出的窗口中选择Distribute App来导出IPA文件。

注意事项

在打包之前，确保你的应用已经通过了所有必要的测试，并且所有的依赖都已经正确安装。
对于生产环境，确保 --dev false 参数被设置，以确保应用以生产模式运行。
如果你使用了第三方库或插件，确保它们支持你想要打包的平台。

React Native打包时遇到错误怎么办？

查看错误信息：打包时，错误信息通常会提供一些线索。仔细阅读错误信息，它会告诉你问题出在哪里，比如是代码错误、配置问题还是依赖问题。
检查依赖：确保所有依赖都已正确安装，并且版本兼容。有时候，依赖库的版本更新可能会导致兼容性问题。 npm install
清理缓存 yarn cache clean
清理项目有时候，清理项目文件夹可以解决一些问题：

rm -rf node_modules
rm yarn.lock
yarn install

检查平台特定的配置

确保你的android和ios文件夹中的配置是正确的。例如，检查AndroidManifest.xml和Info.plist文件中的权限设置。

检查Xcode和Android Studio

确保Xcode和Android Studio是最新的，并且配置正确。有时候，IDE的更新可能会解决一些问题。

查看文档和社区

如果错误信息不明确，或者你不确定如何解决，可以查看React Native的官方文档或社区论坛，如Stack Overflow、GitHub Issues等，看看是否有其他开发者遇到过类似的问题

逐步调试

如果错误信息指向特定的代码行，尝试逐步调试或注释掉该部分代码，看看是否能解决问题。

10.重新创建项目

如果问题依然无法解决，尝试创建一个新的React Native项目，并逐步将旧项目的代码和配置迁移到新项目中。

dotenv-cli

允许你使用 .env 文件来管理环境变量

npm install dotenv-cli --save-dev

"scripts": {
  "start": "dotenv -e .env.development react-native start",
  "android": "dotenv -e .env.development react-native run-android",
  "ios": "dotenv -e .env.development react-native run-ios"
}
const API_URL = process.env.API_URL;
const API_KEY = process.env.API_KEY;

如何使用React Native Config？

允许你在不同的构建配置中定义不同的环境变量

yarn add react-native-config

创建环境文件

在你的项目根目录下创建.env文件，例如：

// .env
API_URL=https://api.example.com
// .env.development
API_URL=https://api.example.com/dev
// .env.production
API_URL=https://api.example.com/prod

iOS

打开Xcode项目。
选择你的项目目标。
转到“Build Settings”标签页。
搜索“Preprocessor Macros”。
在“Preprocessor Macros”中添加一个新的条目，键为CUSTOM_ENV，值为$(CUSTOM_ENV)。

Android

对于Android，你需要在android/app/build.gradle文件中添加环境变量：

android {
    // ...
    defaultConfig {
        // ...
        buildConfigField "String", "CUSTOM_ENV", "\"defaultValue\""
    }
}

使用

在你的React Native代码中，你可以通过import语句导入react-native-config，然后使用Config对象来访问环境变量：

import Config from 'react-native-config';

console.log(Config.CUSTOM_ENV); // 输出环境变量的值

iOS

对于iOS，你可以在运行react-native run-ios命令时添加环境变量：

CUSTOM_ENV=production react-native run-ios

Android

对于Android，你可以在运行react-native run-android命令时添加环境变量：

CUSTOM_ENV=production react-native run-android

实现 React Native 与 Xcode 或 Android Studio 的交互

使用 React Native CLI:

iOS: 在项目根目录下运行 npx react-native run-ios 命令，这会启动 Xcode 并在其中打开你的项目。你可以在 Xcode 中进行调试和编译。
Android: 在项目根目录下运行 npx react-native run-android 命令，这会启动 Android Studio 并在其中打开你的项目。你可以在 Android Studio 中进行调试和编译。

使用热重载（Hot Reloading）和热更新（Hot Reloading）:

在开发过程中，React Native 提供了热重载功能，允许你在不重新编译整个应用的情况下更新应用的 JavaScript 代码。这可以通过在命令行中运行 npx react-native start 启动开发服务器，并在应用中启用热重载功能来实现。

开发过程调试

使用 react-native init 命令创建一个新的 React Native 项目。
项目结构：React Native 项目通常包含一个 ios 文件夹，其中包含了 Xcode 项目文件（.xcodeproj 或 .xcworkspace）。这个文件夹是 Xcode 项目的基础。
npx react-native start 启动服务器。
服务器启动，可以在 Xcode 中打开项目（打开 .xcodeproj 或 .xcworkspace 文件），然后直接运行应用。Xcode 会连接到开发服务器，获取 JavaScript 代码，并在模拟器或真实设备上运行应用。
热重载和热更新：在开发过程中，React Native 提供了热重载（Hot Reloading）和热更新（Hot Updating）功能。热重载允许你在不重启应用的情况下更新应用的 JavaScript 代码，而热更新则允许你在不重新编译应用的情况下更新应用的 JavaScript 代码。
调试：在 Xcode 中，你可以使用 Xcode 的调试工具来调试你的应用。例如，你可以设置断点、查看控制台输出、检查变量等。
构建和发布：当你准备构建和发布你的应用时，你可以使用 Xcode 的构建和发布功能来生成 .ipa 文件，然后提交到 App Store。

`.xcodeproj` 或 `.xcworkspace`

.xcodeproj 文件：

它包含了项目的所有配置信息，如源文件、资源文件、构建设置、目标（targets）等。
通常，如果你的项目中只有一个 Xcode 项目，你将使用 .xcodeproj 文件来打开和管理你的项目。

.xcworkspace 文件：

Xcode 工作区文件，它用于管理多个 Xcode 项目或多个项目文件（.xcodeproj）。
当你的项目依赖于其他项目或库时，这些依赖通常会被添加到一个 .xcworkspace 文件中，这样你就可以在一个地方管理所有相关的项目。
在 React Native 项目中，如果你使用了 CocoaPods 或其他依赖管理工具来添加第三方库，这些库会被添加到一个 .xcworkspace 文件中。这样，你就可以通过打开 .xcworkspace 文件来同时管理你的主项目和所有依赖的项目。

在 Xcode 中，你可以通过以下步骤来打开 .xcworkspace 文件：

打开 Xcode。
选择菜单栏中的 File > Open...。
在弹出的对话框中，选择 .xcworkspace 文件，然后点击 Open。

在大多数情况下，如果你的项目没有复杂的依赖关系，你只需要使用 .xcodeproj 文件即可。如果你的项目依赖于其他项目或库，那么使用 .xcworkspace 文件会更加方便。

平台特定的配置文件

Android

android/app/build.gradle：这个文件包含了 Android 应用的构建配置，例如应用的版本号、依赖库等。
android/gradle.properties：这个文件包含了全局的 Gradle 配置，例如代理设置、缓存路径等。

iOS

ios/your-app-name.xcodeproj：这是 Xcode 项目文件，用于管理 iOS 应用的构建和配置。
ios/your-app-name/Info.plist：这个文件包含了应用的配置信息，例如应用名称、版本号、权限设置等。

React Native 实现原理

JavaScript 与原生代码的桥接：React Native 使用了一个名为“桥接”（Bridge）的机制来连接 JavaScript 和原生代码。
原生组件映射：React Native 为 iOS 和 Android 平台提供了对应的原生组件映射。
虚拟 DOM：使用虚拟 DOM（Virtual DOM）来管理 UI 的状态。
热重载：React Native 提供了热重载（Hot Reloading）功能，允许开发者在不重启应用的情况下实时更新代码。这大大提高了开发效率，使得开发者可以快速看到代码更改的效果。

ReactiveCocoa 的冷热信号

ReactiveCocoa 是一个用于 Objective-C 和 Swift 的响应式编程框架，

ReactiveCocoa 使用信号（Signals）和行为（Behaviors）来表示和处理异步事件流。

ReactiveCocoa 中的信号可以是冷信号（Cold Signals）或热信号（Hot Signals）：

冷信号：每次订阅时都会重新执行其内部的代码块。
热信号：热信号在创建后就开始执行其内部的代码块，并且可以被多个订阅者共享。

信号可以转换为行为（Behavior），行为是一种特殊的信号，它总是持有最新的值，并且可以被订阅者访问。行为可以用来表示状态，例如 UI 控件的状态。

组件​

事件 8​

react native性能优化​

HermesInternal​

动画​

Platform 模块​

pushy​

样式​

怎么实现react native和原生交互​

如何调用相机​

React 元素树​

React 影子树​

Yoga 树​

Fabric​

java native interface(JNI​

渲染流水线​

跨平台的实现​

视图拍平​

webview和rn实现通信​

渲染流程​

React native有几个线程，分别负责什么工作，有阻塞关系​

appRegistry的作用​

桥接机制的工作原理​

桥接层是如何处理内存泄漏的？​

React native怎么打包​

React Native打包时遇到错误怎么办？​

dotenv-cli​

如何使用React Native Config？​

实现 React Native 与 Xcode 或 Android Studio 的交互​

开发过程调试​

.xcodeproj 或 .xcworkspace​

平台特定的配置文件​

React Native 实现原理​

ReactiveCocoa 的冷热信号​

组件