Embrace the Grind: How Work Can Be a Path to Personal Growth and Happiness
22nd August 2024The Power of Storytelling in Design
3rd September 2024The release of React Native 0.75 marks a significant milestone with a series of impactful updates and changes aimed at improving performance, stability, and the overall developer experience. Below, we provide a comprehensive overview of the enhancements, new features, and breaking changes included in this version.
For those interested in the previous version, you can review the details of React Native 0.74 by visiting the following link:Â Release React Native 0.74.0.
Highlights 🚀
Enhancements in Yoga 3.1 and Layout Improvements
React Native 0.75 includes Yoga 3.1, which brings several enhancements and new layout capabilities. One of the key highlights is the support for percentage values in layout properties such as gaps and translation. These updates provide more flexible and responsive design options, available exclusively in the New Architecture. Users interested in these features should consider migrating to the updated architecture.
Stabilizing the New Architecture
This release continues the journey towards stabilizing the New Architecture. Since its Beta announcement at React Conf, multiple bug fixes and improvements have been made:
- Font Size Adjustment on Android:Â Fixed issues with adjustsFontSizeToFit.
- Text Alignment:Â Resolved textAlign not working with inline views on Android.
- Text Baseline:Â Addressed text baseline issues on iOS.
Collaborations and New APIs
- Expo Integration:Â New Architecture support information is now available in the React Native Directory, simplifying library compatibility checks.
- Stable API for TurboModules:Â A new stable API for accessing theÂ
jsi::Runtime
 in TurboModules is introduced, providing a secure method for native modules to interact with the runtime.
Frameworks and Productivity
React Native 0.75 reinforces the recommendation to build apps using frameworks like Expo for enhanced productivity and a superior developer experience.
- Template Migration:Â TheÂ
/template
 folder has been moved toÂ@react-native-community/template
, allowing for faster updates and better community maintenance. - Sunsetting react-native init: The react-native init command will be deprecated on December 31st, 2024. After this date, useÂ
npx create-expo-app
for Expo orÂnpx @react-native-community/cli init
 for the Community CLI. Other commands likeÂreact-native config
 will continue to work as usual. - Auto-Linking Performance Improvements: The auto-linking logic has been rewritten for better performance, with significant speed improvements on both Android and iOS.
Breaking changes ⚙️
Touchables in TypeScript
Touchables
like TouchableOpacity
and TouchableHighlight
are now functional components and cannot be used as types in generic expressions.
import { TouchableHighlight } from 'react-native';
const ref = useRef<TouchableHighlight>();
Instead, use React.ElementRef
or the View type.
import { TouchableHighlight } from 'react-native';
const ref1 = useRef<React.ElementRef<typeof TouchableHighlight>>();
// or
const ref2 = useRef<View>();
End of Support for Older Platforms
React Native 0.75 is the last version to support minSdk 23 (Android 6.0) and minIOSVersion 13.4. Starting with React Native 0.76, the minimum supported versions will be Android 7.0 (minSdk 24) and iOS 15.1. More details can be found in the official announcements for Android and iOS.
Removal of JSIModule on Android
The com.facebook.react.bridge.JSIModule
API, initially introduced to facilitate direct JSI access for Native Modules on Android, has been retired. The deprecation in version 0.74 saw minimal usage, leading to its complete removal in 0.75. Developers should transition to using Turbo Native Modules for similar functionality.
Changes to Android PopUp Menu
In a move to modularize the core functionalities, the Android PopUpMenu
has been extracted to a separate package. The following core methods have been deprecated:
UIManagerModule.showPopupMenu()
UIManagerModule.dismissPopupMenu()
Developers should now use the <PopupMenuAndroid />
component from the @react-native/popup-menu-android
package.
Finalizing PushNotificationIOS Deprecation on iOS
With the ongoing deprecation of the PushNotificationIOS
module, several legacy APIs have been removed in version 0.75:
+ (void)didReceiveLocalNotification:(UILocalNotification *)notification;
+ (void)didReceiveRemoteNotification:(NSDictionary *)notification;
The updated API to use is didReceiveNotification:(UNNotification *)notification
, ensuring better alignment with current notification standards.
Updates to Community CLI
Two commands have been removed from the Community CLI to improve performance and focus on modern tooling:
ram-bundle
: This command is obsolete with the introduction of Hermes, which serves as the default JS engine. Direct memory bundle loading is no longer recommended.profile-hermes
: The profiling tool used an outdatedÂ.cpuprofile
 format incompatible with recent Chrome versions. CPU profiling can now be accessed via the “Profiler” panel in the Experimental New Debugger.
These updates reflect React Native’s commitment to modernizing the development experience, ensuring better performance, and maintaining compatibility with current standards. The improvements in this release pave the way for more robust and efficient app development.
Breaking Changes in React Native 0.75 ⚒️
General
- Codegen: Dropped Cxx token from C++ TurboModules class names.
- Float Enums: No longer supported due to precision errors.
- Error Handling: Throws error when passing null toÂ
non-nullable
arguments in Native. - Linting: ESLint no longer runs Prettier.
C++
- ScrollViewShadowNode: New bool includeTransform parameter in the constructor.
- RuntimeExecutor: RemovedÂ
executeAsynchronously
 andÂexecuteSynchronously_CAN_DEADLOCK
. - Error Handling: RenamedÂ
JsErrorHandlingFunc
 toÂOnJsError
. - Imports: Removed unused import fromÂ
ReactPrimitives.h
. - Methods:Â
LongLivedObjectCollection
 andÂLongLivedObject
 now accept a Runtime parameter. - File Renaming:Â
utils/jsi.h
 toÂjsi-utils.h
.
TextInput
- Callback Removal: Removed deprecatedÂ
onTextInput
 callback.
Pressability
- Method Removal: RemovedÂ
onLongPressShouldCancelPress_DEPRECATED
,ÂonResponderTerminationRequest_DEPRECATED
, andÂonStartShouldSetResponder_DEPRECATED
.
Android
- ReactViewBackgroundDrawable: Deprecated in favor ofÂ
CSSBackgroundDrawable
. - ReactContext: Now abstract; useÂ
BridgeReactContext
 andÂBridgelessReactContext
. - Layout: Supports percentage flex gap values.
- Runtime: RemovedÂ
ReactJsExceptionHandler
 fromÂReactHostImpl
. - DevSupport:Â
DevSupportManagerFactory.create()
 now acceptsÂPausedInDebuggerOverlayManager
. - Measurement: DeletedÂ
UIManagerModule.measureLayoutRelativeToParent()
.
iOS
- Runtime: RemovedÂ
[RCTHost getSurfacePresenter]
 andÂ[RCTHost getModuleRegistry]
. - Image: RemovedÂ
RCTImageLoadingPerfInstrumentationEnabled
. - Error Handling: RemovedÂ
RCTRedBox
 access throughÂRCTBridge
. - CocoaPods: RenamedÂ
BUILD_FROM_SOURCE
 toÂRCT_BUILD_HERMES_FROM_SOURCE
. - TextInput: Removed deprecatedÂ
onTextInput
 callback.
Conclusion
React Native 0.75 introduces critical updates that streamline the development process and improve performance and compatibility. Developers are encouraged to review these changes carefully and update their projects to ensure a smooth transition. This release represents a significant step forward in the evolution of React Native, reinforcing the framework’s commitment to providing a modern, efficient, and robust development experience.
Contact Us : xpertlab
More Info : react-native