Skip to content

Commit 54d266b

Browse files
authored
Clarify New Architecture Terminology (facebook#3308)
1 parent 42e0266 commit 54d266b

19 files changed

+206
-134
lines changed

docs/new-architecture-app-intro.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -188,7 +188,7 @@ React Native also supports a local version of this file `.xcode.env.local`. This
188188

189189
## iOS - Use Objective-C++ (`.mm` extension)
190190

191-
TurboModules can be written using Objective-C or C++. In order to support both cases, any source files that include C++ code should use the `.mm` file extension. This extension corresponds to Objective-C++, a language variant that allows for the use of a combination of C++ and Objective-C in source files.
191+
Turbo Native Modules can be written using Objective-C or C++. In order to support both cases, any source files that include C++ code should use the `.mm` file extension. This extension corresponds to Objective-C++, a language variant that allows for the use of a combination of C++ and Objective-C in source files.
192192

193193
:::important
194194

docs/new-architecture-app-modules-android.md

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -100,7 +100,7 @@ yarn react-native run-android
100100

101101
## 2. Java/Kotlin - Provide a `ReactPackageTurboModuleManagerDelegate`
102102

103-
Now is time to actually use the TurboModule.
103+
Now is time to actually use the Turbo Native Module.
104104
First, we will need to create a `ReactPackageTurboModuleManagerDelegate` subclass, like the following:
105105

106106
<Tabs groupId="android-language" defaultValue={constants.defaultAndroidLanguage} values={constants.androidLanguages}>
@@ -193,7 +193,7 @@ protected constructor(
193193

194194
Please note that the `SoLoader.loadLibrary` parameter (in this case `"myapplication_appmodules")` should be the same as the one specified for `project()` inside the `CMakeLists.txt` file you created before.
195195

196-
This class will then be responsible of loading the TurboModules and will take care of loading the native library build with the NDK at runtime.
196+
This class will then be responsible of loading the Turbo Native Modules and will take care of loading the native library build with the NDK at runtime.
197197

198198
## 3. Adapt your `ReactNativeHost` to use the `ReactPackageTurboModuleManagerDelegate`
199199

@@ -259,7 +259,7 @@ class MyApplication : Application(), ReactApplication {
259259

260260
## 4. Extend the `getPackages()` from your `ReactNativeHost` to use the TurboModule
261261

262-
Still on the `ReactNativeHost` , we need to extend the the `getPackages()` method to include the newly created TurboModule. Update the method to include the following:
262+
Still on the `ReactNativeHost` , we need to extend the the `getPackages()` method to include the newly created Turbo Native Module. Update the method to include the following:
263263

264264
<Tabs groupId="android-language" defaultValue={constants.defaultAndroidLanguage} values={constants.androidLanguages}>
265265
<TabItem value="java">
@@ -493,7 +493,7 @@ std::shared_ptr<TurboModule> MyApplicationModuleProvider(const std::string modul
493493
Please adapt the `samplelibrary.h` import to match the same library name you provided when building the apps.
494494
This is the C++ generated file that is created by the codegen.
495495
496-
Here you can also specify more than one provider, should you have more than one TurboModule. Specifically in this example we look for a TurboModule from `samplelibrary` (the one we specified) and we fallback to the `rncore` Module Provider (containing all the Core modules).
496+
Here you can also specify more than one provider, should you have more than one Turbo Native Module. Specifically in this example we look for a Turbo Native Module from `samplelibrary` (the one we specified) and we fallback to the `rncore` Module Provider (containing all the Core modules).
497497
498498
```cpp
499499
#include "MyApplicationModuleProvider.h"
@@ -532,7 +532,7 @@ JNIEXPORT jint JNICALL JNI_OnLoad(JavaVM *vm, void *) {
532532
533533
## 6. Enable the `useTurboModules` flag in your Application `onCreate`
534534
535-
Now you can finally enable the `TurboModule `support in your Application. To do so, you need to turn on the `useTurboModule` flag inside your Application `onCreate` method.
535+
Now you can finally enable the `Turbo Native Module` support in your Application. To do so, you need to turn on the `useTurboModule` flag inside your Application `onCreate` method.
536536
537537
<Tabs groupId="android-language" defaultValue={constants.defaultAndroidLanguage} values={constants.androidLanguages}>
538538
<TabItem value="java">

docs/new-architecture-app-renderer-android.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -113,7 +113,7 @@ LOG Running "App" with {"fabric":true,"initialProps":{},"rootTag":1}
113113

114114
## Migrating Android ViewManagers
115115

116-
First, make sure you followed the instructions to [Enabling the New Renderer (Fabric) in Your Android Application](#enabling-the-new-renderer-fabric-in-your-android-application). Plus we will also assume that you followed the instructions from [Enabling the New NativeModule System (TurboModule) in Your Android Application](#enabling-the-new-nativemodule-system-turbomodule-in-your-android-application) as the native builds setup steps are presented over there and won’t be repeated here.
116+
First, make sure you followed the instructions to [Enabling the New Renderer (Fabric) in Your Android Application](#enabling-the-new-renderer-fabric-in-your-android-application). Plus we will also assume that you followed the instructions from [Enabling the New NativeModule System (Turbo Module) in Your Android Application](#enabling-the-new-nativemodule-system-turbomodule-in-your-android-application) as the native builds setup steps are presented over there and won’t be repeated here.
117117

118118
### JavaScript changes
119119

docs/new-architecture-appendix.md

Lines changed: 13 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,16 @@ import NewArchitectureWarning from './\_markdown-new-architecture-warning.mdx';
77

88
<NewArchitectureWarning/>
99

10-
## I. Flow Type to Native Type Mapping
10+
## I. Terminology
11+
12+
The whole New Architecture related guides will stick to the following **terminology**:
13+
14+
- **Legacy Native Components** - To refer to Components which are running on the old React Native architecture.
15+
- **Legacy Native Modules** - To refer to Modules which are running on the old React Native architecture.
16+
- **Fabric Native Components** - To refer to Components which have been adapted to work well with the New Architecture, namely the new renderer. For brevity you might find them referred as **Fabric Components**.
17+
- **Turbo Native Modules** - To refer to Modules which have been adapted to work well with the New Architecture, namely the new Native Module System. For brevity you might find them referred as **Turbo Modules**
18+
19+
## II. Flow Type to Native Type Mapping
1120

1221
You may use the following table as a reference for which types are supported and what they map to in each platform:
1322

@@ -85,7 +94,7 @@ Callback functions are not type checked, and are generalized as `Object`s.
8594
You may also find it useful to refer to the JavaScript specifications for the core modules in React Native. These are located inside the `Libraries/` directory in the React Native repository.
8695
:::
8796

88-
## II. TypeScript to Native Type Mapping
97+
## III. TypeScript to Native Type Mapping
8998

9099
You may use the following table as a reference for which types are supported and what they map to in each platform:
91100

@@ -105,7 +114,7 @@ You may use the following table as a reference for which types are supported and
105114

106115
You may also find it useful to refer to the JavaScript specifications for the core modules in React Native. These are located inside the `Libraries/` directory in the React Native repository.
107116

108-
## III. Invoking the code-gen during development
117+
## IV. Invoking the code-gen during development
109118

110119
> This section contains information specific to v0.66 of React Native.
111120
@@ -182,7 +191,7 @@ node node_modules/react-native/scripts/generate-specs-cli.js \
182191

183192
In the above example, the code-gen script will generate several files: `MyLibSpecs.h` and `MyLibSpecs-generated.mm`, as well as a handful of `.h` and `.cpp` files, all located in the `ios` directory.
184193

185-
## IV. Note on Existing Apps
194+
## V. Note on Existing Apps
186195

187196
This guide provides instructions for migrating an application that is based on the default app template that is provided by React Native. If your app has deviated from the template, or you are working with an application that was never based off the template, then the following sections might help.
188197

docs/new-architecture-intro.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ import NewArchitectureWarning from './\_markdown-new-architecture-warning.mdx';
99

1010
# Getting Started with the New Architecture
1111

12-
This migration guide is designed for React Native **library authors** and **application developers**. It outlines the steps you need to follow to roll out the new Architecture, composed by the **new NativeModule system (TurboModule) and the new Renderer (Fabric)** to your **Android** and **iOS** libraries and apps.
12+
This migration guide is designed for React Native **library authors** and **application developers**. It outlines the steps you need to follow to roll out the new Architecture, composed by the **New Native Module system (Turbo Module) and the new Renderer (Fabric)** to your **Android** and **iOS** libraries and apps.
1313

1414
## Table of Contents
1515

@@ -23,7 +23,7 @@ The guide is divided into five sections:
2323
- **Supporting the New Architecture in your App**
2424
- [Prerequisites for Supporting the New Architecture in your App](new-architecture-app-intro)
2525
- Android
26-
- [Enabling the New NativeModule System (TurboModule) in your App](new-architecture-app-modules-android)
26+
- [Enabling the New Native Module System (Turbo Module) in your App](new-architecture-app-modules-android)
2727
- [Enabling the New Renderer (Fabric) in your App](new-architecture-app-renderer-android)
2828
- [**React 18 & React Native**](react-18-and-react-native)
2929
- [**Troubleshooting**](new-architecture-troubleshooting)

docs/new-architecture-library-intro.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ Currently, this guide is written under the assumption that you will be using [Fl
2323

2424
To adopt the New Architecture, you start by creating these specs for your native modules and native components. You can do this prior to actually migrating to the New Architecture: the specs will be used later on to generate native interface code for all the supported platforms as a way to enforce uniform APIs across platforms.
2525

26-
#### Turbomodules
26+
#### Turbo Native Modules
2727

2828
JavaScript spec files **must** be named `Native<MODULE_NAME>.js` and they export a `TurboModuleRegistry` `Spec` object. The name convention is important because the Codegen process looks for modules whose `js` (`jsx`, `ts`, or `tsx`) spec file starts with the keyword `Native`.
2929

@@ -70,7 +70,7 @@ export default TurboModuleRegistry.get<Spec>('<MODULE_NAME>');
7070
</TabItem>
7171
</Tabs>
7272
73-
#### Fabric Components
73+
#### Fabric Native Components
7474
7575
JavaScript spec files **must** be named `<FABRIC COMPONENT>NativeComponent.js` (for TypeScript use extension `.ts` or `.tsx`) and they export a `HostComponent` object. The name convention is important: the Codegen process looks for components whose spec file (either JavaScript or TypeScript) ends with the suffix `NativeComponent`.
7676
@@ -214,7 +214,7 @@ Codegen can be configured in the `package.json` file of your Library. Add the fo
214214
215215
- The `codegenConfig` is the key used by the Codegen to verify that there is some code to generate.
216216
- The `name` field is the name of the library.
217-
- The `type` field is used to identify the type of module we want to create. Our suggestion is to keep `all` to support libraries that contain both TurboModule and Fabric Components.
217+
- The `type` field is used to identify the type of module we want to create. Our suggestion is to keep `all` to support libraries that contain both Turbo Native Module and Fabric Native Components.
218218
- The `jsSrcsDir` is the directory where the codegen will start looking for JavaScript specs.
219219
- The `android.javaPackageName` is the name of the package where the generated code wil end up.
220220

docs/new-architecture-library-ios.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,7 @@ Pod::Spec.new do |s|
3232
}
3333

3434
s.dependency "React-Core"
35-
s.dependency "React-RCTFabric" # This is for Fabric Component
35+
s.dependency "React-RCTFabric" # This is for Fabric Native Component
3636
s.dependency "React-Codegen"
3737
s.dependency "RCT-Folly"
3838
s.dependency "RCTRequired"

docs/react-18-and-react-native.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@ The concurrent features in React 18 are built on top of the new concurrent rende
3131

3232
Previous versions of React Native built on the old architecture **cannot** support concurrent rendering or concurrent features. This is because the old architecture relied on mutating the native trees, which doesn’t allow for React to prepare multiple versions of the tree at the same time.
3333

34-
Fortunately, the New Architecture was written bottom-up with concurrent rendering in mind, and is fully compatible with React 18. This means, in order to upgrade to React 18 in your React Native app, your application needs to be migrated to the React Native's New Architecture including Fabric and TurboModules.
34+
Fortunately, the New Architecture was written bottom-up with concurrent rendering in mind, and is fully compatible with React 18. This means, in order to upgrade to React 18 in your React Native app, your application needs to be migrated to the React Native's New Architecture including Fabric Native Components and Turbo Native Modules.
3535

3636
## React 18 enabled by default
3737

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
11
:::info
22
Native Module and Native Components are our stable technologies used by the legacy architecture.
3-
They will be deprecated in the future when the New Architecture will be stable. The New Architecture uses [TurboModule](./the-new-architecture/pillars-turbomodules) and [Fabric Components](./the-new-architecture/pillars-fabric-components) to achieve similar results.
3+
They will be deprecated in the future when the New Architecture will be stable. The New Architecture uses [Turbo Native Module](./the-new-architecture/pillars-turbomodules) and [Fabric Native Components](./the-new-architecture/pillars-fabric-components) to achieve similar results.
44
:::

0 commit comments

Comments
 (0)