This is the 45th edition of the React Native Weekly. It covers updates from 28th February to 6th of March.
This week includes 48 commits from 23 distinct authors.
Highlights
- Added Runtime.getHeadUsage for Hermes
- Introduce viewRegistry_DEPRECATED addUIBlock for Fabric migration
- Added Event and CustomEvent W3c-compatible polyfills
Include folly fabric headers in source files [iOS] [Fabric]
Danilo Bürger info@danilobuerger.de fixed a compilation issue on iOS when including react-native-safe-area-context 4.0.1 with Fabric enabled.
diff --git a/third-party-podspecs/RCT-Folly.podspec b/third-party-podspecs/RCT-Folly.podspec
index 0ae3060bdc8..700cd7e2cfb 100644
--- a/third-party-podspecs/RCT-Folly.podspec
+++ b/third-party-podspecs/RCT-Folly.podspec
@@ -91,7 +91,11 @@ Pod::Spec.new do |spec|
'folly/concurrency/CacheLocality.cpp',
'folly/detail/Futex.cpp',
'folly/synchronization/ParkingLot.cpp',
- 'folly/portability/Malloc.cpp'
+ 'folly/portability/Malloc.cpp',
+ 'folly/concurrency/CacheLocality.h',
+ 'folly/synchronization/ParkingLot.h',
+ 'folly/synchronization/SanitizeThread.h',
+ 'folly/system/ThreadId.h'Performance logger concurrent mode annotation
The performance logger will now contain an annotation to tag if in concurrent mode.
diff --git a/Libraries/ReactNative/renderApplication.js b/Libraries/ReactNative/renderApplication.js
index 5663a47a7ad..d3f2d87971d 100644
--- a/Libraries/ReactNative/renderApplication.js
+++ b/Libraries/ReactNative/renderApplication.js
@@ -64,6 +64,10 @@ function renderApplication<Props: Object>(
}
performanceLogger.startTimespan('renderApplication_React_render');
+ performanceLogger.setExtra(
+ 'usedReactConcurrentRoot',
+ useConcurrentRoot ? '1' : '0',
+ );Added Runtime.getHeadUsage for Hermes
Janic Duplessis janicduplessis@gmail.com added Runtime.getHeapUsage for Hermes Chrome inspector.
This will enable seeing a summary of memory usage from JavaScript in Devtools.
Migrating codegenNativeComponent to be Bridgeless compatible
Paige Sun paigesun@fb.com migrated the codegenNativeComponent to be Bridgeless compatible.
We learn to use UIManager.hasViewManagerConfig to check the existence of a view manager instead of UIManager.getViewManagerConfig to be bridgeless compatible.
Introduce _viewRegistry_DEPRECATED addUIBlock for Fabric migration
Paige Sun paigesun@fb.com added _viewRegistry_DEPRECATED addUIBlock to make it easier to migrate View Managers to Fabric.
With Fabric the UIManager will no longer exist, and the use uiManager addUIBlock will need to be replaced by _viewRegistry_DEPRECATED addUIBlock.
Paige also exemplified the migration to “Bridgeless” mode with the DatePickerIOS.
Fix transform when calculate overflowInset
This contribution is a clear example of how the shared C++ interface benefits from work focused on one of the platforms - Android.
Xin Chen xch@fb.com fixed overflowInset calculation when a shadow node has transform matrix from a transform prop in JS.
note how Xin has made various improvements to Android which seem related to supporting VR based on what I’ve followed so far.
Xin’s commit message goes into great detail into the problem he faced plus fix.
Improve rendering of images when resampled and corner radius applied [Android]
Pieter De Baets pieterdb@fb.com improved rendering images by enabling paintFilterBitmap when rendering images with rounded corners.
Guarantee configureNdkBild depends on preBuild task [Android]
According to Nicola Corti ncor@fb.com, due to a bug with AGP, the configureNdkBuild* tasks are not depending on preBuild tasks. Thus, Nicola added a fix which manually guarantees this dependency.
Added Event and CustomEvent W3c-compatible polyfills
Joshua Gross joshuagross@fb.com added these polyfills in preparation for upcoming changes.
Fixed error caused by re-registering bubbling event by RCTModalHostView
According HeyImChris 48299693+HeyImChris@users.noreply.github.com they are seeing the following error Component 'RCTModalHostView' re-registered bubbling event 'topDismiss' as a direct event moduleConstantsForComponent on a react-native-macOS build.
This is fixed by replacing RCTBubblingEventBlock for RCTDirectEventBlock.
diff --git a/React/Views/RCTModalHostView.h b/React/Views/RCTModalHostView.h
index 0246328f99f..2fcdcaea83f 100644
--- a/React/Views/RCTModalHostView.h
+++ b/React/Views/RCTModalHostView.h
@@ -38,7 +38,7 @@
@property (nonatomic, copy) RCTDirectEventBlock onOrientationChange;
// Fabric only
-@property (nonatomic, copy) RCTBubblingEventBlock onDismiss;
+@property (nonatomic, copy) RCTDirectEventBlock onDismiss;Setup a Gradle build inside ReactAndroid/hermes-engine to download Hermes sources
Adapted from Nicola’s commit message, Nicola Corti ncor@fb.com started a Gradle build inside ReactAndroid/hermes-engine to kickoff a small project where we can download Hermes sources and start a compilation of Hermes sources from there.
Added asBool() method to JSI Value
Scott Kyle skyle@fb.com added the asBool() method to the JSI object for easier conversion of data.
Allow usage of TurboModules in context with RTTI
Nikita Lutsenko nlutsenko@fb.com moved the definitions of TurboModule’s virtual methods to declaration to allow for use in context with RTTI.
Library upgrades
- c92b64b16a5 Upgrade Metro dependencies to 0.69.0
Partners
- TypeScript Weekly: The best TypeScript links every week, right in your inbox.
- This Week In React: the best of React & React Native news. Sebastien filters the noise, and you save time!
- ES.next News: learn about the latest in JavaScript and cross-platform tools.
- Tailwind Weekly: all things Tailwind CSS, new issue every Saturday.
Done
If you want to see more checkout the previous week’s posts here. Subscribe to get notified when new posts are out = )