新架構(gòu)主要由兩大支柱組成：
TurboModules 是創(chuàng)建利用某些平臺(tái)特定 API 的庫(kù)的首選方法。
Fabric 組件是創(chuàng)建可重用 UI 組件的首選方法，為用戶(hù)提供原生體驗(yàn)。
TurboModules
Turbo Native Modules 與 Native Modules 相比，存在以下優(yōu)勢(shì)：
- 各個(gè)平臺(tái)的強(qiáng)類(lèi)型接口聲明是一致的；
- 您可以使用 C++ 編寫(xiě)模塊或遷移其它平臺(tái)的原生代碼，以此避免在跨平臺(tái)重復(fù)實(shí)現(xiàn)模塊；
- 模塊支持懶加載，可以加快 App 啟動(dòng)速度；
- 通過(guò)替換 Bridge 為 JSI（使用原生代碼編寫(xiě)的 JavaScript 接口），提升 JavaScript 與原生代碼的通訊效率。
Fabric 組件
Fabric 組件是一種使用 Fabric 渲染器渲染并展示在屏幕上的 UI 組件。在新架構(gòu)中，使用 Fabric 組件替代原生組件具有以下優(yōu)勢(shì)：
- 各個(gè)平臺(tái)的強(qiáng)類(lèi)型接口聲明是一致的；
- 您可以使用 C++ 編寫(xiě)組件或遷移其它平臺(tái)的原生代碼，以此避免在跨平臺(tái)重復(fù)實(shí)現(xiàn)組件；
- 通過(guò)替換 Bridge 為 JSI（使用原生代碼編寫(xiě)的 JavaScript 接口），提升 JavaScript 與原生代碼的通訊效率。
Codegen
Codegen 不算是新架構(gòu)的主要組成部分，它是一個(gè)幫助我們避免編寫(xiě)重復(fù)代碼的工具。Codegen 并非必選項(xiàng)，您仍然可以手寫(xiě)它所生成的代碼，但是使用它來(lái)生成腳手架代碼可以幫您節(jié)省不少時(shí)間。
React Native 會(huì)在每次構(gòu)建 iOS 或 Android App 時(shí)調(diào)用 Codegen。您只需偶爾手動(dòng)執(zhí)行生成代碼的腳本，以此聲明需要生成哪些類(lèi)型和文件。比方說(shuō)，有個(gè)常見(jiàn)的場(chǎng)景就是開(kāi)發(fā) TurboModule 和 Fabric 組件。
運(yùn)行
node node_modules/react_native/scripts/generate-artifacts.js \
--path SampleApp/ \
--outputPath <an/output/path> \
生產(chǎn)的代碼
codegen
└── build
└── generated
└── ios
├── MyTurboModuleSpecs
│ ├── MyTurboModuleSpecs-generated.mm
│ └── MyTurboModuleSpecs.h
├── FBReactNativeSpec
│ ├── FBReactNativeSpec-generated.mm
│ └── FBReactNativeSpec.h
├── RCTThirdPartyFabricComponentsProvider.h
├── RCTThirdPartyFabricComponentsProvider.mm
└── react
└── renderer
└── components
├── MyFabricComponent
│ ├── ComponentDescriptors.h
│ ├── EventEmitters.cpp
│ ├── EventEmitters.h
│ ├── Props.cpp
│ ├── Props.h
│ ├── RCTComponentViewHelpers.h
│ ├── ShadowNodes.cpp
│ └── ShadowNodes.h
└── rncore
├── ComponentDescriptors.h
├── EventEmitters.cpp
├── EventEmitters.h
├── Props.cpp
├── Props.h
├── RCTComponentViewHelpers.h
├── ShadowNodes.cpp
└── ShadowNodes.h
