Skip to content

Commit cb308bd

Browse files
rubennortefacebook-github-bot
authored andcommitted
Add benchmark for host component class variants (facebook#48450)
Summary: Pull Request resolved: facebook#48450 Changelog: [internal] This implements a basic benchmark to compare `ReactFabricHostComponent` and `ReactNativeElement` (legacy and DOM implementations for native component instances). Reviewed By: rshest Differential Revision: D66698546 fbshipit-source-id: dd4bde833e5c9eb32c79a52d06f3c360fb012e23
1 parent ff7c550 commit cb308bd

File tree

1 file changed

+61
-0
lines changed

1 file changed

+61
-0
lines changed
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,61 @@
1+
/**
2+
* Copyright (c) Meta Platforms, Inc. and affiliates.
3+
*
4+
* This source code is licensed under the MIT license found in the
5+
* LICENSE file in the root directory of this source tree.
6+
*
7+
* @flow strict-local
8+
* @format
9+
* @oncall react_native
10+
*/
11+
12+
import '../../../Core/InitializeCore.js';
13+
import type {
14+
InternalInstanceHandle,
15+
ViewConfig,
16+
} from '../../../Renderer/shims/ReactNativeTypes';
17+
18+
import ReactNativeElement from '../../../../src/private/webapis/dom/nodes/ReactNativeElement';
19+
import ReactFabricHostComponent from '../../../ReactNative/ReactFabricPublicInstance/ReactFabricHostComponent';
20+
import {benchmark} from '@react-native/fantom';
21+
import nullthrows from 'nullthrows';
22+
23+
// Create fake parameters for the class.
24+
const tag = 11;
25+
const viewConfig: ViewConfig = {
26+
uiViewClassName: 'test',
27+
validAttributes: {
28+
style: {},
29+
},
30+
};
31+
// $FlowExpectedError[incompatible-type]
32+
const internalInstanceHandle: InternalInstanceHandle = {};
33+
34+
benchmark
35+
.suite('ReactNativeElement vs. ReactFabricHostComponent')
36+
.add('ReactNativeElement', () => {
37+
// eslint-disable-next-line no-new
38+
new ReactNativeElement(tag, viewConfig, internalInstanceHandle);
39+
})
40+
.add('ReactFabricHostComponent', () => {
41+
// eslint-disable-next-line no-new
42+
new ReactFabricHostComponent(tag, viewConfig, internalInstanceHandle);
43+
})
44+
.verify(([modernImplResults, legacyImplResults]) => {
45+
const minMedian = Math.min(
46+
nullthrows(modernImplResults.latency.p50),
47+
nullthrows(legacyImplResults.latency.p50),
48+
);
49+
const maxMedian = Math.max(
50+
nullthrows(modernImplResults.latency.p50),
51+
nullthrows(legacyImplResults.latency.p50),
52+
);
53+
54+
const medianDifferencePercent = ((maxMedian - minMedian) / minMedian) * 100;
55+
console.log(
56+
`Difference in p50 values between ReactFabricHostComponent and ReactNativeElement is ${medianDifferencePercent.toFixed(2)}%`,
57+
);
58+
59+
// No implementation should be more than 25% slower than the other.
60+
expect(medianDifferencePercent).toBeLessThan(25);
61+
});

0 commit comments

Comments
 (0)