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.
Samuel Susla committed
Dec 2, 2022 at 15:53 UTC
353c30252f67145fa8241b6979d570cb152c2b22
8 files changed
+31
-9
packages/react-native-renderer/src/ReactFabric.js
+7
-2
@@ -44,6 +44,11 @@ import {LegacyRoot, ConcurrentRoot} from 'react-reconciler/src/ReactRootTags';
44
import ReactSharedInternals from 'shared/ReactSharedInternals';
45
import getComponentNameFromType from 'shared/getComponentNameFromType';
46
47
+const {
48
+ dispatchCommand: fabricDispatchCommand,
49
+ sendAccessibilityEvent: fabricSendAccessibilityEvent,
50
+} = nativeFabricUIManager;
51
+
52
const ReactCurrentOwner = ReactSharedInternals.ReactCurrentOwner;
53
54
function findHostInstance_DEPRECATED<TElementType: ElementType>(
@@ -168,7 +173,7 @@ function dispatchCommand(handle: any, command: string, args: Array<any>) {
173
if (handle._internalInstanceHandle != null) {
174
const {stateNode} = handle._internalInstanceHandle;
175
if (stateNode != null) {
171
- nativeFabricUIManager.dispatchCommand(stateNode.node, command, args);
176
+ fabricDispatchCommand(stateNode.node, command, args);
177
}
178
} else {
179
UIManager.dispatchViewManagerCommand(handle._nativeTag, command, args);
@@ -189,7 +194,7 @@ function sendAccessibilityEvent(handle: any, eventType: string) {
194
if (handle._internalInstanceHandle != null) {
195
const {stateNode} = handle._internalInstanceHandle;
196
if (stateNode != null) {
192
- nativeFabricUIManager.sendAccessibilityEvent(stateNode.node, eventType);
197
+ fabricSendAccessibilityEvent(stateNode.node, eventType);
198
}
199
} else {
200
legacySendAccessibilityEvent(handle._nativeTag, eventType);
packages/react-native-renderer/src/ReactFabricGlobalResponderHandler.js
+4
-2
@@ -10,6 +10,8 @@
10
// Module provided by RN:
11
import {UIManager} from 'react-native/Libraries/ReactPrivate/ReactNativePrivateInterface';
12
13
+const {setIsJSResponder} = nativeFabricUIManager;
14
+
15
const ReactFabricGlobalResponderHandler = {
16
onChange: function(from: any, to: any, blockNativeResponder: boolean) {
17
const fromOrTo = from || to;
@@ -21,7 +23,7 @@ const ReactFabricGlobalResponderHandler = {
23
if (isFabric) {
24
if (from) {
25
// equivalent to clearJSResponder
24
- nativeFabricUIManager.setIsJSResponder(
26
+ setIsJSResponder(
27
from.stateNode.node,
28
false,
29
blockNativeResponder || false,
@@ -30,7 +32,7 @@ const ReactFabricGlobalResponderHandler = {
32
33
if (to) {
34
// equivalent to setJSResponder
33
- nativeFabricUIManager.setIsJSResponder(
35
+ setIsJSResponder(
36
to.stateNode.node,
37
true,
38
blockNativeResponder || false,
packages/react-native-renderer/src/ReactNativeFiberInspector.js
+5
-3
@@ -26,6 +26,8 @@ if (__DEV__) {
26
Object.freeze(emptyObject);
27
}
28
29
+const {measure, findNodeAtPoint} = nativeFabricUIManager;
30
+
31
let createHierarchy;
32
let getHostNode;
33
let getHostProps;
@@ -53,7 +55,7 @@ if (__DEV__ || enableGetInspectorDataForInstanceInProduction) {
55
hostFiber.stateNode.node;
56
57
if (shadowNode) {
56
- nativeFabricUIManager.measure(shadowNode, callback);
58
+ measure(shadowNode, callback);
59
} else {
60
return UIManager.measure(
61
getHostNode(fiber, findNodeHandle),
@@ -195,7 +197,7 @@ if (__DEV__) {
197
198
if (inspectedView._internalInstanceHandle != null) {
199
// For Fabric we can look up the instance handle directly and measure it.
198
- nativeFabricUIManager.findNodeAtPoint(
200
+ findNodeAtPoint(
201
inspectedView._internalInstanceHandle.stateNode.node,
202
locationX,
203
locationY,
@@ -215,7 +217,7 @@ if (__DEV__) {
217
const nativeViewTag =
218
internalInstanceHandle.stateNode.canonical._nativeTag;
219
218
- nativeFabricUIManager.measure(
220
+ measure(
221
internalInstanceHandle.stateNode.node,
222
(x, y, width, height, pageX, pageY) => {
223
const inspectorData = getInspectorDataForInstance(
packages/react-native-renderer/src/ReactNativeRenderer.js
+7
-2
@@ -49,6 +49,11 @@ import getComponentNameFromType from 'shared/getComponentNameFromType';
49
50
const ReactCurrentOwner = ReactSharedInternals.ReactCurrentOwner;
51
52
+const {
53
+ sendAccessibilityEvent: fabricSendAccessibilityEvent,
54
+ dispatchCommand: fabricDispatchCommand,
55
+} = nativeFabricUIManager;
56
+
57
function findHostInstance_DEPRECATED(
58
componentOrHandle: any,
59
): ?React$ElementRef<HostComponent<mixed>> {
@@ -165,7 +170,7 @@ function dispatchCommand(handle: any, command: string, args: Array<any>) {
170
if (handle._internalInstanceHandle != null) {
171
const {stateNode} = handle._internalInstanceHandle;
172
if (stateNode != null) {
168
- nativeFabricUIManager.dispatchCommand(stateNode.node, command, args);
173
+ fabricDispatchCommand(stateNode.node, command, args);
174
}
175
} else {
176
UIManager.dispatchViewManagerCommand(handle._nativeTag, command, args);
@@ -186,7 +191,7 @@ function sendAccessibilityEvent(handle: any, eventType: string) {
191
if (handle._internalInstanceHandle != null) {
192
const {stateNode} = handle._internalInstanceHandle;
193
if (stateNode != null) {
189
- nativeFabricUIManager.sendAccessibilityEvent(stateNode.node, eventType);
194
+ fabricSendAccessibilityEvent(stateNode.node, eventType);
195
}
196
} else {
197
legacySendAccessibilityEvent(handle._nativeTag, eventType);
packages/react-native-renderer/src/__tests__/ReactNativeError-test.internal.js
+2
@@ -28,6 +28,8 @@ describe('ReactNativeError', () => {
28
beforeEach(() => {
29
jest.resetModules();
30
31
+ require('react-native/Libraries/ReactPrivate/InitializeNativeFabricUIManager');
32
+
33
React = require('react');
34
ReactNative = require('react-native-renderer');
35
createReactNativeComponentClass = require('react-native/Libraries/ReactPrivate/ReactNativePrivateInterface')
packages/react-native-renderer/src/__tests__/ReactNativeEvents-test.internal.js
+2
@@ -63,6 +63,8 @@ const fakeRequireNativeComponent = (uiViewClassName, validAttributes) => {
63
beforeEach(() => {
64
jest.resetModules();
65
66
+ require('react-native/Libraries/ReactPrivate/InitializeNativeFabricUIManager');
67
+
68
PropTypes = require('prop-types');
69
RCTEventEmitter = require('react-native/Libraries/ReactPrivate/ReactNativePrivateInterface')
70
.RCTEventEmitter;
packages/react-native-renderer/src/__tests__/ReactNativeMount-test.internal.js
+2
@@ -30,6 +30,8 @@ describe('ReactNative', () => {
30
beforeEach(() => {
31
jest.resetModules();
32
33
+ require('react-native/Libraries/ReactPrivate/InitializeNativeFabricUIManager');
34
+
35
React = require('react');
36
StrictMode = React.StrictMode;
37
ReactNative = require('react-native-renderer');
packages/react-native-renderer/src/__tests__/createReactNativeComponentClass-test.internal.js
+2
@@ -18,6 +18,8 @@ describe('createReactNativeComponentClass', () => {
18
beforeEach(() => {
19
jest.resetModules();
20
21
+ require('react-native/Libraries/ReactPrivate/InitializeNativeFabricUIManager');
22
+
23
createReactNativeComponentClass = require('react-native/Libraries/ReactPrivate/ReactNativePrivateInterface')
24
.ReactNativeViewConfigRegistry.register;
25
React = require('react');