Hold host functions in var (#25741)

Calling any function on `nativeFabricUIManager`, for example
`nativeFabricUIManager.measure`, results in a round trip to the host
platform through jsi layer. It is the same for repeated calls to same
host function. This is unnecessary overload which can be avoided by
retaining host function in a variable.

Author: sammy-SC

packages/react-native-renderer/src/ReactFabric.js

@@ -44,6 +44,11 @@ import {LegacyRoot, ConcurrentRoot} from 'react-reconciler/src/ReactRootTags';
 import ReactSharedInternals from 'shared/ReactSharedInternals';
 import getComponentNameFromType from 'shared/getComponentNameFromType';
 
+const {
+  dispatchCommand: fabricDispatchCommand,
+  sendAccessibilityEvent: fabricSendAccessibilityEvent,
+} = nativeFabricUIManager;
+
 const ReactCurrentOwner = ReactSharedInternals.ReactCurrentOwner;
 
 function findHostInstance_DEPRECATED<TElementType: ElementType>(
@@ -168,7 +173,7 @@ function dispatchCommand(handle: any, command: string, args: Array<any>) {
   if (handle._internalInstanceHandle != null) {
     const {stateNode} = handle._internalInstanceHandle;
     if (stateNode != null) {
-      nativeFabricUIManager.dispatchCommand(stateNode.node, command, args);
+      fabricDispatchCommand(stateNode.node, command, args);
     }
   } else {
     UIManager.dispatchViewManagerCommand(handle._nativeTag, command, args);
@@ -189,7 +194,7 @@ function sendAccessibilityEvent(handle: any, eventType: string) {
   if (handle._internalInstanceHandle != null) {
     const {stateNode} = handle._internalInstanceHandle;
     if (stateNode != null) {
-      nativeFabricUIManager.sendAccessibilityEvent(stateNode.node, eventType);
+      fabricSendAccessibilityEvent(stateNode.node, eventType);
     }
   } else {
     legacySendAccessibilityEvent(handle._nativeTag, eventType);

packages/react-native-renderer/src/ReactFabricGlobalResponderHandler.js

@@ -10,6 +10,8 @@
 // Module provided by RN:
 import {UIManager} from 'react-native/Libraries/ReactPrivate/ReactNativePrivateInterface';
 
+const {setIsJSResponder} = nativeFabricUIManager;
+
 const ReactFabricGlobalResponderHandler = {
   onChange: function(from: any, to: any, blockNativeResponder: boolean) {
     const fromOrTo = from || to;
@@ -21,7 +23,7 @@ const ReactFabricGlobalResponderHandler = {
     if (isFabric) {
       if (from) {
         // equivalent to clearJSResponder
-        nativeFabricUIManager.setIsJSResponder(
+        setIsJSResponder(
           from.stateNode.node,
           false,
           blockNativeResponder || false,
@@ -30,7 +32,7 @@ const ReactFabricGlobalResponderHandler = {
 
       if (to) {
         // equivalent to setJSResponder
-        nativeFabricUIManager.setIsJSResponder(
+        setIsJSResponder(
           to.stateNode.node,
           true,
           blockNativeResponder || false,

packages/react-native-renderer/src/ReactNativeFiberInspector.js

@@ -26,6 +26,8 @@ if (__DEV__) {
   Object.freeze(emptyObject);
 }
 
+const {measure, findNodeAtPoint} = nativeFabricUIManager;
+
 let createHierarchy;
 let getHostNode;
 let getHostProps;
@@ -53,7 +55,7 @@ if (__DEV__ || enableGetInspectorDataForInstanceInProduction) {
               hostFiber.stateNode.node;
 
             if (shadowNode) {
-              nativeFabricUIManager.measure(shadowNode, callback);
+              measure(shadowNode, callback);
             } else {
               return UIManager.measure(
                 getHostNode(fiber, findNodeHandle),
@@ -195,7 +197,7 @@ if (__DEV__) {
 
     if (inspectedView._internalInstanceHandle != null) {
       // For Fabric we can look up the instance handle directly and measure it.
-      nativeFabricUIManager.findNodeAtPoint(
+      findNodeAtPoint(
         inspectedView._internalInstanceHandle.stateNode.node,
         locationX,
         locationY,
@@ -215,7 +217,7 @@ if (__DEV__) {
           const nativeViewTag =
             internalInstanceHandle.stateNode.canonical._nativeTag;
 
-          nativeFabricUIManager.measure(
+          measure(
             internalInstanceHandle.stateNode.node,
             (x, y, width, height, pageX, pageY) => {
               const inspectorData = getInspectorDataForInstance(

packages/react-native-renderer/src/ReactNativeRenderer.js

@@ -49,6 +49,11 @@ import getComponentNameFromType from 'shared/getComponentNameFromType';
 
 const ReactCurrentOwner = ReactSharedInternals.ReactCurrentOwner;
 
+const {
+  sendAccessibilityEvent: fabricSendAccessibilityEvent,
+  dispatchCommand: fabricDispatchCommand,
+} = nativeFabricUIManager;
+
 function findHostInstance_DEPRECATED(
   componentOrHandle: any,
 ): ?React$ElementRef<HostComponent<mixed>> {
@@ -165,7 +170,7 @@ function dispatchCommand(handle: any, command: string, args: Array<any>) {
   if (handle._internalInstanceHandle != null) {
     const {stateNode} = handle._internalInstanceHandle;
     if (stateNode != null) {
-      nativeFabricUIManager.dispatchCommand(stateNode.node, command, args);
+      fabricDispatchCommand(stateNode.node, command, args);
     }
   } else {
     UIManager.dispatchViewManagerCommand(handle._nativeTag, command, args);
@@ -186,7 +191,7 @@ function sendAccessibilityEvent(handle: any, eventType: string) {
   if (handle._internalInstanceHandle != null) {
     const {stateNode} = handle._internalInstanceHandle;
     if (stateNode != null) {
-      nativeFabricUIManager.sendAccessibilityEvent(stateNode.node, eventType);
+      fabricSendAccessibilityEvent(stateNode.node, eventType);
     }
   } else {
     legacySendAccessibilityEvent(handle._nativeTag, eventType);

packages/react-native-renderer/src/__tests__/ReactNativeError-test.internal.js

@@ -28,6 +28,8 @@ describe('ReactNativeError', () => {
   beforeEach(() => {
     jest.resetModules();
 
+    require('react-native/Libraries/ReactPrivate/InitializeNativeFabricUIManager');
+
     React = require('react');
     ReactNative = require('react-native-renderer');
     createReactNativeComponentClass = require('react-native/Libraries/ReactPrivate/ReactNativePrivateInterface')

packages/react-native-renderer/src/__tests__/ReactNativeEvents-test.internal.js

@@ -63,6 +63,8 @@ const fakeRequireNativeComponent = (uiViewClassName, validAttributes) => {
 beforeEach(() => {
   jest.resetModules();
 
+  require('react-native/Libraries/ReactPrivate/InitializeNativeFabricUIManager');
+
   PropTypes = require('prop-types');
   RCTEventEmitter = require('react-native/Libraries/ReactPrivate/ReactNativePrivateInterface')
     .RCTEventEmitter;

packages/react-native-renderer/src/__tests__/ReactNativeMount-test.internal.js

@@ -30,6 +30,8 @@ describe('ReactNative', () => {
   beforeEach(() => {
     jest.resetModules();
 
+    require('react-native/Libraries/ReactPrivate/InitializeNativeFabricUIManager');
+
     React = require('react');
     StrictMode = React.StrictMode;
     ReactNative = require('react-native-renderer');

packages/react-native-renderer/src/__tests__/createReactNativeComponentClass-test.internal.js

@@ -18,6 +18,8 @@ describe('createReactNativeComponentClass', () => {
   beforeEach(() => {
     jest.resetModules();
 
+    require('react-native/Libraries/ReactPrivate/InitializeNativeFabricUIManager');
+
     createReactNativeComponentClass = require('react-native/Libraries/ReactPrivate/ReactNativePrivateInterface')
       .ReactNativeViewConfigRegistry.register;
     React = require('react');