[DevTools] Add initial APIs for logging instrumentation events under feature flag (#22276)
Juan committed
Sep 14, 2021 at 11:10 UTC
50263d3273b6fc983acc5b0fd52e670399b248b1
13 files changed
+234
-110
packages/react-devtools-extensions/src/main.js
+5
@@ -18,6 +18,7 @@ import {
18
localStorageRemoveItem,
19
localStorageSetItem,
20
} from 'react-devtools-shared/src/storage';
21
+import {registerEventLogger} from 'react-devtools-shared/src/Logger';
22
import DevTools from 'react-devtools-shared/src/devtools/views/DevTools';
23
import {__DEBUG__} from 'react-devtools-shared/src/constants';
24
@@ -87,6 +88,10 @@ function createPanelIfReactLoaded() {
88
89
const tabId = chrome.devtools.inspectedWindow.tabId;
90
91
+ registerEventLogger((event: LogEvent) => {
92
+ // TODO: hook up event logging
93
+ });
94
+
95
function initBridgeAndStore() {
96
const port = chrome.runtime.connect({
97
name: '' + tabId,
packages/react-devtools-shared/src/Logger.js
new
+47
@@ -0,0 +1,47 @@
1
+/**
2
+ * Copyright (c) Facebook, Inc. and its 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
+ */
9
+
10
+import {enableLogger} from 'react-devtools-feature-flags';
11
+
12
+type LoadHookNamesEvent = {|
13
+ +name: 'loadHookNames',
14
+ +displayName: string | null,
15
+ +numberOfHooks: number | null,
16
+ +durationMs: number,
17
+ +resolution: 'success' | 'error' | 'timeout' | 'unknown',
18
+|};
19
+
20
+// prettier-ignore
21
+export type LogEvent =
22
+ | LoadHookNamesEvent;
23
+
24
+export type LogFunction = LogEvent => void;
25
+
26
+let loggers: Array<LogFunction> = [];
27
+export const logEvent: LogFunction =
28
+ enableLogger === true
29
+ ? function logEvent(event: LogEvent): void {
30
+ loggers.forEach(log => {
31
+ log(event);
32
+ });
33
+ }
34
+ : function logEvent() {};
35
+
36
+export const registerEventLogger =
37
+ enableLogger === true
38
+ ? function registerEventLogger(eventLogger: LogFunction): () => void {
39
+ if (enableLogger) {
40
+ loggers.push(eventLogger);
41
+ return function unregisterEventLogger() {
42
+ loggers = loggers.filter(logger => logger !== eventLogger);
43
+ };
44
+ }
45
+ return () => {};
46
+ }
47
+ : function registerEventLogger() {};
packages/react-devtools-shared/src/PerformanceLoggingUtils.js
renamed
+53
-14
@@ -14,6 +14,9 @@ const supportsUserTiming =
14
typeof performance.mark === 'function' &&
15
typeof performance.clearMarks === 'function';
16
17
+const supportsPerformanceNow =
18
+ typeof performance !== 'undefined' && typeof performance.now === 'function';
19
+
20
function mark(markName: string): void {
21
if (supportsUserTiming) {
22
performance.mark(markName + '-start');
@@ -27,42 +30,78 @@ function measure(markName: string): void {
30
}
31
}
32
30
-export async function withAsyncPerformanceMark<TReturn>(
33
+function now(): number {
34
+ if (supportsPerformanceNow) {
35
+ return performance.now();
36
+ }
37
+ return Date.now();
38
+}
39
+
40
+export async function withAsyncPerfMeasurements<TReturn>(
41
markName: string,
42
callback: () => Promise<TReturn>,
43
+ onComplete?: number => void,
44
): Promise<TReturn> {
45
+ const start = now();
46
if (__PERFORMANCE_PROFILE__) {
47
mark(markName);
36
- const result = await callback();
48
+ }
49
+ const result = await callback();
50
+
51
+ if (__PERFORMANCE_PROFILE__) {
52
measure(markName);
38
- return result;
53
}
40
- return callback();
54
+
55
+ if (onComplete != null) {
56
+ const duration = now() - start;
57
+ onComplete(duration);
58
+ }
59
+
60
+ return result;
61
}
62
43
-export function withSyncPerformanceMark<TReturn>(
63
+export function withSyncPerfMeasurements<TReturn>(
64
markName: string,
65
callback: () => TReturn,
66
+ onComplete?: number => void,
67
): TReturn {
68
+ const start = now();
69
if (__PERFORMANCE_PROFILE__) {
70
mark(markName);
49
- const result = callback();
71
+ }
72
+ const result = callback();
73
+
74
+ if (__PERFORMANCE_PROFILE__) {
75
measure(markName);
51
- return result;
76
}
53
- return callback();
77
+
78
+ if (onComplete != null) {
79
+ const duration = now() - start;
80
+ onComplete(duration);
81
+ }
82
+
83
+ return result;
84
}
85
56
-export function withCallbackPerformanceMark<TReturn>(
86
+export function withCallbackPerfMeasurements<TReturn>(
87
markName: string,
88
callback: (done: () => void) => TReturn,
89
+ onComplete?: number => void,
90
): TReturn {
91
+ const start = now();
92
if (__PERFORMANCE_PROFILE__) {
93
mark(markName);
62
- const done = () => {
63
- measure(markName);
64
- };
65
- return callback(done);
94
}
67
- return callback(() => {});
95
+
96
+ const done = () => {
97
+ if (__PERFORMANCE_PROFILE__) {
98
+ measure(markName);
99
+ }
100
+
101
+ if (onComplete != null) {
102
+ const duration = now() - start;
103
+ onComplete(duration);
104
+ }
105
+ };
106
+ return callback(done);
107
}
packages/react-devtools-shared/src/config/DevToolsFeatureFlags.core-fb.js
+1
@@ -16,6 +16,7 @@
16
export const enableProfilerChangedHookIndices = true;
17
export const isInternalFacebookBuild = true;
18
export const enableNamedHooksFeature = false;
19
+export const enableLogger = false;
20
export const consoleManagedByDevToolsDuringStrictMode = false;
21
22
/************************************************************************
packages/react-devtools-shared/src/config/DevToolsFeatureFlags.core-oss.js
+1
@@ -16,6 +16,7 @@
16
export const enableProfilerChangedHookIndices = false;
17
export const isInternalFacebookBuild = false;
18
export const enableNamedHooksFeature = false;
19
+export const enableLogger = false;
20
export const consoleManagedByDevToolsDuringStrictMode = false;
21
22
/************************************************************************
packages/react-devtools-shared/src/config/DevToolsFeatureFlags.default.js
+1
@@ -16,4 +16,5 @@
16
export const enableProfilerChangedHookIndices = false;
17
export const isInternalFacebookBuild = false;
18
export const enableNamedHooksFeature = true;
19
+export const enableLogger = false;
20
export const consoleManagedByDevToolsDuringStrictMode = true;
packages/react-devtools-shared/src/config/DevToolsFeatureFlags.extension-fb.js
+1
@@ -16,6 +16,7 @@
16
export const enableProfilerChangedHookIndices = true;
17
export const isInternalFacebookBuild = true;
18
export const enableNamedHooksFeature = true;
19
+export const enableLogger = false;
20
export const consoleManagedByDevToolsDuringStrictMode = true;
21
22
/************************************************************************
packages/react-devtools-shared/src/config/DevToolsFeatureFlags.extension-oss.js
+1
@@ -16,6 +16,7 @@
16
export const enableProfilerChangedHookIndices = true;
17
export const isInternalFacebookBuild = false;
18
export const enableNamedHooksFeature = true;
19
+export const enableLogger = false;
20
export const consoleManagedByDevToolsDuringStrictMode = true;
21
22
/************************************************************************
packages/react-devtools-shared/src/hookNamesCache.js
+86
-58
@@ -18,6 +18,8 @@ import type {
18
} from 'react-devtools-shared/src/types';
19
import type {HookSource} from 'react-debug-tools/src/ReactDebugHooks';
20
import type {FetchFileWithCaching} from 'react-devtools-shared/src/devtools/views/Components/FetchFileWithCachingContext';
21
+import {withCallbackPerfMeasurements} from './PerformanceLoggingUtils';
22
+import {logEvent} from './Logger';
23
24
const TIMEOUT = 30000;
25
@@ -92,6 +94,11 @@ export function loadHookNames(
94
},
95
};
96
97
+ let timeoutID;
98
+ let didTimeout = false;
99
+ let resolution = 'unknown';
100
+ let resolvedHookNames: HookNames | null = null;
101
+
102
const wake = () => {
103
if (timeoutID) {
104
clearTimeout(timeoutID);
@@ -103,71 +110,92 @@ export function loadHookNames(
110
callbacks.clear();
111
};
112
113
+ const handleLoadComplete = (durationMs: number): void => {
114
+ // Log duration for parsing hook names
115
+ logEvent({
116
+ name: 'loadHookNames',
117
+ displayName: element.displayName,
118
+ numberOfHooks: resolvedHookNames?.size ?? null,
119
+ durationMs,
120
+ resolution,
121
+ });
122
+ };
123
+
124
const newRecord: Record<HookNames> = (record = {
125
status: Pending,
126
value: wakeable,
127
});
128
111
- let didTimeout = false;
112
-
113
- loadHookNamesFunction(hooksTree, fetchFileWithCaching).then(
114
- function onSuccess(hookNames) {
115
- if (didTimeout) {
116
- return;
117
- }
118
-
119
- if (__DEBUG__) {
120
- console.log('[hookNamesCache] onSuccess() hookNames:', hookNames);
121
- }
122
-
123
- if (hookNames) {
124
- const resolvedRecord = ((newRecord: any): ResolvedRecord<HookNames>);
125
- resolvedRecord.status = Resolved;
126
- resolvedRecord.value = hookNames;
127
- } else {
128
- const notFoundRecord = ((newRecord: any): RejectedRecord);
129
- notFoundRecord.status = Rejected;
130
- notFoundRecord.value = null;
131
- }
132
-
133
- wake();
134
- },
135
- function onError(error) {
136
- if (didTimeout) {
137
- return;
138
- }
139
-
140
- if (__DEBUG__) {
141
- console.log('[hookNamesCache] onError()');
142
- }
143
-
144
- console.error(error);
145
-
146
- const thrownRecord = ((newRecord: any): RejectedRecord);
147
- thrownRecord.status = Rejected;
148
- thrownRecord.value = null;
149
-
150
- wake();
129
+ withCallbackPerfMeasurements(
130
+ 'loadHookNames',
131
+ done => {
132
+ loadHookNamesFunction(hooksTree, fetchFileWithCaching).then(
133
+ function onSuccess(hookNames) {
134
+ if (didTimeout) {
135
+ return;
136
+ }
137
+
138
+ if (__DEBUG__) {
139
+ console.log('[hookNamesCache] onSuccess() hookNames:', hookNames);
140
+ }
141
+
142
+ if (hookNames) {
143
+ const resolvedRecord = ((newRecord: any): ResolvedRecord<HookNames>);
144
+ resolvedRecord.status = Resolved;
145
+ resolvedRecord.value = hookNames;
146
+ } else {
147
+ const notFoundRecord = ((newRecord: any): RejectedRecord);
148
+ notFoundRecord.status = Rejected;
149
+ notFoundRecord.value = null;
150
+ }
151
+
152
+ resolution = 'success';
153
+ resolvedHookNames = hookNames;
154
+ done();
155
+ wake();
156
+ },
157
+ function onError(error) {
158
+ if (didTimeout) {
159
+ return;
160
+ }
161
+
162
+ if (__DEBUG__) {
163
+ console.log('[hookNamesCache] onError()');
164
+ }
165
+
166
+ console.error(error);
167
+
168
+ const thrownRecord = ((newRecord: any): RejectedRecord);
169
+ thrownRecord.status = Rejected;
170
+ thrownRecord.value = null;
171
+
172
+ resolution = 'error';
173
+ done();
174
+ wake();
175
+ },
176
+ );
177
+
178
+ // Eventually timeout and stop trying to load names.
179
+ timeoutID = setTimeout(function onTimeout() {
180
+ if (__DEBUG__) {
181
+ console.log('[hookNamesCache] onTimeout()');
182
+ }
183
+
184
+ timeoutID = null;
185
+
186
+ didTimeout = true;
187
+
188
+ const timedoutRecord = ((newRecord: any): RejectedRecord);
189
+ timedoutRecord.status = Rejected;
190
+ timedoutRecord.value = null;
191
+
192
+ resolution = 'timeout';
193
+ done();
194
+ wake();
195
+ }, TIMEOUT);
196
},
197
+ handleLoadComplete,
198
);
153
-
154
- // Eventually timeout and stop trying to load names.
155
- let timeoutID = setTimeout(function onTimeout() {
156
- if (__DEBUG__) {
157
- console.log('[hookNamesCache] onTimeout()');
158
- }
159
-
160
- timeoutID = null;
161
-
162
- didTimeout = true;
163
-
164
- const timedoutRecord = ((newRecord: any): RejectedRecord);
165
- timedoutRecord.status = Rejected;
166
- timedoutRecord.value = null;
167
-
168
- wake();
169
- }, TIMEOUT);
170
-
199
map.set(element, record);
200
}
201
packages/react-devtools-shared/src/hooks/astUtils.js
+5
-5
@@ -7,7 +7,7 @@
7
* @flow
8
*/
9
10
-import {withSyncPerformanceMark} from 'react-devtools-shared/src/PerformanceMarks';
10
+import {withSyncPerfMeasurements} from 'react-devtools-shared/src/PerformanceLoggingUtils';
11
import traverse, {NodePath, Node} from '@babel/traverse';
12
import {File} from '@babel/types';
13
@@ -132,7 +132,7 @@ export function getHookName(
132
originalSourceLineNumber: number,
133
originalSourceColumnNumber: number,
134
): string | null {
135
- const hooksFromAST = withSyncPerformanceMark(
135
+ const hooksFromAST = withSyncPerfMeasurements(
136
'getPotentialHookDeclarationsFromAST(originalSourceAST)',
137
() => getPotentialHookDeclarationsFromAST(originalSourceAST),
138
);
@@ -176,7 +176,7 @@ export function getHookName(
176
// nodesAssociatedWithReactHookASTNode could directly be used to obtain the hook variable name
177
// depending on the type of potentialReactHookASTNode
178
try {
179
- const nodesAssociatedWithReactHookASTNode = withSyncPerformanceMark(
179
+ const nodesAssociatedWithReactHookASTNode = withSyncPerfMeasurements(
180
'getFilteredHookASTNodes()',
181
() =>
182
getFilteredHookASTNodes(
@@ -186,7 +186,7 @@ export function getHookName(
186
),
187
);
188
189
- const name = withSyncPerformanceMark('getHookNameFromNode()', () =>
189
+ const name = withSyncPerfMeasurements('getHookNameFromNode()', () =>
190
getHookNameFromNode(
191
hook,
192
nodesAssociatedWithReactHookASTNode,
@@ -297,7 +297,7 @@ function getHookVariableName(
297
298
function getPotentialHookDeclarationsFromAST(sourceAST: File): NodePath[] {
299
const potentialHooksFound: NodePath[] = [];
300
- withSyncPerformanceMark('traverse(sourceAST)', () =>
300
+ withSyncPerfMeasurements('traverse(sourceAST)', () =>
301
traverse(sourceAST, {
302
enter(path) {
303
if (path.isVariableDeclarator() && isPotentialHookDeclaration(path)) {
packages/react-devtools-shared/src/hooks/parseHookNames/index.js
+2
-2
@@ -12,7 +12,7 @@ import type {HooksNode, HooksTree} from 'react-debug-tools/src/ReactDebugHooks';
12
import type {HookNames} from 'react-devtools-shared/src/types';
13
import type {FetchFileWithCaching} from 'react-devtools-shared/src/devtools/views/Components/FetchFileWithCachingContext';
14
15
-import {withAsyncPerformanceMark} from 'react-devtools-shared/src/PerformanceMarks';
15
+import {withAsyncPerfMeasurements} from 'react-devtools-shared/src/PerformanceLoggingUtils';
16
import WorkerizedParseSourceAndMetadata from './parseSourceAndMetadata.worker';
17
import typeof * as ParseSourceAndMetadataModule from './parseSourceAndMetadata';
18
import {flattenHooksList, loadSourceAndMetadata} from './loadSourceAndMetadata';
@@ -37,7 +37,7 @@ export async function parseHookNames(
37
hooksTree: HooksTree,
38
fetchFileWithCaching: FetchFileWithCaching | null,
39
): Promise<HookNames | null> {
40
- return withAsyncPerformanceMark('parseHookNames', async () => {
40
+ return withAsyncPerfMeasurements('parseHookNames', async () => {
41
const hooksList = flattenHooksList(hooksTree);
42
if (hooksList.length === 0) {
43
// This component tree contains no named hooks.
packages/react-devtools-shared/src/hooks/parseHookNames/loadSourceAndMetadata.js
+16
-16
@@ -49,10 +49,10 @@ import {__DEBUG__} from 'react-devtools-shared/src/constants';
49
import {getHookSourceLocationKey} from 'react-devtools-shared/src/hookNamesCache';
50
import {sourceMapIncludesSource} from '../SourceMapUtils';
51
import {
52
- withAsyncPerformanceMark,
53
- withCallbackPerformanceMark,
54
- withSyncPerformanceMark,
55
-} from 'react-devtools-shared/src/PerformanceMarks';
52
+ withAsyncPerfMeasurements,
53
+ withCallbackPerfMeasurements,
54
+ withSyncPerfMeasurements,
55
+} from 'react-devtools-shared/src/PerformanceLoggingUtils';
56
57
import type {
58
HooksNode,
@@ -98,17 +98,17 @@ export async function loadSourceAndMetadata(
98
hooksList: HooksList,
99
fetchFileWithCaching: FetchFileWithCaching | null,
100
): Promise<LocationKeyToHookSourceAndMetadata> {
101
- return withAsyncPerformanceMark('loadSourceAndMetadata()', async () => {
102
- const locationKeyToHookSourceAndMetadata = withSyncPerformanceMark(
101
+ return withAsyncPerfMeasurements('loadSourceAndMetadata()', async () => {
102
+ const locationKeyToHookSourceAndMetadata = withSyncPerfMeasurements(
103
'initializeHookSourceAndMetadata',
104
() => initializeHookSourceAndMetadata(hooksList),
105
);
106
107
- await withAsyncPerformanceMark('loadSourceFiles()', () =>
107
+ await withAsyncPerfMeasurements('loadSourceFiles()', () =>
108
loadSourceFiles(locationKeyToHookSourceAndMetadata, fetchFileWithCaching),
109
);
110
111
- await withAsyncPerformanceMark('extractAndLoadSourceMapJSON()', () =>
111
+ await withAsyncPerfMeasurements('extractAndLoadSourceMapJSON()', () =>
112
extractAndLoadSourceMapJSON(locationKeyToHookSourceAndMetadata),
113
);
114
@@ -157,7 +157,7 @@ function extractAndLoadSourceMapJSON(
157
// TODO (named hooks) If this RegExp search is slow, we could try breaking it up
158
// first using an indexOf(' sourceMappingURL=') to find the start of the comment
159
// (probably at the end of the file) and then running the RegExp on the remaining substring.
160
- let sourceMappingURLMatch = withSyncPerformanceMark(
160
+ let sourceMappingURLMatch = withSyncPerfMeasurements(
161
'sourceMapRegex.exec(runtimeSourceCode)',
162
() => sourceMapRegex.exec(runtimeSourceCode),
163
);
@@ -185,12 +185,12 @@ function extractAndLoadSourceMapJSON(
185
const trimmed = ((sourceMappingURL.match(
186
/base64,([a-zA-Z0-9+\/=]+)/,
187
): any): Array<string>)[1];
188
- const decoded = withSyncPerformanceMark(
188
+ const decoded = withSyncPerfMeasurements(
189
'decodeBase64String()',
190
() => decodeBase64String(trimmed),
191
);
192
193
- const sourceMapJSON = withSyncPerformanceMark(
193
+ const sourceMapJSON = withSyncPerfMeasurements(
194
'JSON.parse(decoded)',
195
() => JSON.parse(decoded),
196
);
@@ -227,7 +227,7 @@ function extractAndLoadSourceMapJSON(
227
}
228
229
// If the first source map we found wasn't a match, check for more.
230
- sourceMappingURLMatch = withSyncPerformanceMark(
230
+ sourceMappingURLMatch = withSyncPerfMeasurements(
231
'sourceMapRegex.exec(runtimeSourceCode)',
232
() => sourceMapRegex.exec(runtimeSourceCode),
233
);
@@ -266,7 +266,7 @@ function extractAndLoadSourceMapJSON(
266
dedupedFetchPromises.get(url) ||
267
fetchFile(url).then(
268
sourceMapContents => {
269
- const sourceMapJSON = withSyncPerformanceMark(
269
+ const sourceMapJSON = withSyncPerfMeasurements(
270
'JSON.parse(sourceMapContents)',
271
() => JSON.parse(sourceMapContents),
272
);
@@ -316,7 +316,7 @@ function fetchFile(
316
url: string,
317
markName?: string = 'fetchFile',
318
): Promise<string> {
319
- return withCallbackPerformanceMark(`${markName}("${url}")`, done => {
319
+ return withCallbackPerfMeasurements(`${markName}("${url}")`, done => {
320
return new Promise((resolve, reject) => {
321
fetch(url, FETCH_OPTIONS).then(
322
response => {
@@ -376,7 +376,7 @@ export function hasNamedHooks(hooksTree: HooksTree): boolean {
376
377
export function flattenHooksList(hooksTree: HooksTree): HooksList {
378
const hooksList: HooksList = [];
379
- withSyncPerformanceMark('flattenHooksList()', () => {
379
+ withSyncPerfMeasurements('flattenHooksList()', () => {
380
flattenHooksListImpl(hooksTree, hooksList);
381
});
382
@@ -472,7 +472,7 @@ function loadSourceFiles(
472
// If a helper function has been injected to fetch with caching,
473
// use it to fetch the (already loaded) source file.
474
fetchFileFunction = url => {
475
- return withAsyncPerformanceMark(
475
+ return withAsyncPerfMeasurements(
476
`fetchFileWithCaching("${url}")`,
477
() => {
478
return ((fetchFileWithCaching: any): FetchFileWithCaching)(url);
packages/react-devtools-shared/src/hooks/parseHookNames/parseSourceAndMetadata.js
+15
-15
@@ -19,9 +19,9 @@ import {__DEBUG__} from 'react-devtools-shared/src/constants';
19
import {getHookSourceLocationKey} from 'react-devtools-shared/src/hookNamesCache';
20
import {SourceMapMetadataConsumer} from '../SourceMapMetadataConsumer';
21
import {
22
- withAsyncPerformanceMark,
23
- withSyncPerformanceMark,
24
-} from 'react-devtools-shared/src/PerformanceMarks';
22
+ withAsyncPerfMeasurements,
23
+ withSyncPerfMeasurements,
24
+} from 'react-devtools-shared/src/PerformanceLoggingUtils';
25
26
import type {
27
HooksList,
@@ -106,27 +106,27 @@ export async function parseSourceAndMetadata(
106
hooksList: HooksList,
107
locationKeyToHookSourceAndMetadata: LocationKeyToHookSourceAndMetadata,
108
): Promise<HookNames | null> {
109
- return withAsyncPerformanceMark('parseSourceAndMetadata()', async () => {
110
- const locationKeyToHookParsedMetadata = withSyncPerformanceMark(
109
+ return withAsyncPerfMeasurements('parseSourceAndMetadata()', async () => {
110
+ const locationKeyToHookParsedMetadata = withSyncPerfMeasurements(
111
'initializeHookParsedMetadata',
112
() => initializeHookParsedMetadata(locationKeyToHookSourceAndMetadata),
113
);
114
115
- withSyncPerformanceMark('parseSourceMaps', () =>
115
+ withSyncPerfMeasurements('parseSourceMaps', () =>
116
parseSourceMaps(
117
locationKeyToHookSourceAndMetadata,
118
locationKeyToHookParsedMetadata,
119
),
120
);
121
122
- withSyncPerformanceMark('parseSourceAST()', () =>
122
+ withSyncPerfMeasurements('parseSourceAST()', () =>
123
parseSourceAST(
124
locationKeyToHookSourceAndMetadata,
125
locationKeyToHookParsedMetadata,
126
),
127
);
128
129
- return withSyncPerformanceMark('findHookNames()', () =>
129
+ return withSyncPerfMeasurements('findHookNames()', () =>
130
findHookNames(hooksList, locationKeyToHookParsedMetadata),
131
);
132
});
@@ -174,7 +174,7 @@ function findHookNames(
174
let name;
175
const {metadataConsumer} = hookParsedMetadata;
176
if (metadataConsumer != null) {
177
- name = withSyncPerformanceMark('metadataConsumer.hookNameFor()', () =>
177
+ name = withSyncPerfMeasurements('metadataConsumer.hookNameFor()', () =>
178
metadataConsumer.hookNameFor({
179
line: originalSourceLineNumber,
180
column: originalSourceColumnNumber,
@@ -184,7 +184,7 @@ function findHookNames(
184
}
185
186
if (name == null) {
187
- name = withSyncPerformanceMark('getHookName()', () =>
187
+ name = withSyncPerfMeasurements('getHookName()', () =>
188
getHookName(
189
hook,
190
hookParsedMetadata.originalSourceAST,
@@ -303,7 +303,7 @@ function parseSourceAST(
303
// Now that the source map has been loaded,
304
// extract the original source for later.
305
// TODO (named hooks) Refactor this read, github.com/facebook/react/pull/22181
306
- const {column, line, source} = withSyncPerformanceMark(
306
+ const {column, line, source} = withSyncPerfMeasurements(
307
'sourceConsumer.originalPositionFor()',
308
() =>
309
sourceConsumer.originalPositionFor({
@@ -329,7 +329,7 @@ function parseSourceAST(
329
// It can be relative if the source map specifies it that way,
330
// but we use it as a cache key across different source maps and there can be collisions.
331
originalSourceURL = (source: string);
332
- originalSourceCode = withSyncPerformanceMark(
332
+ originalSourceCode = withSyncPerfMeasurements(
333
'sourceConsumer.sourceContentFor()',
334
() => (sourceConsumer.sourceContentFor(source, true): string),
335
);
@@ -401,7 +401,7 @@ function parseSourceAST(
401
402
// TODO (named hooks) This is probably where we should check max source length,
403
// rather than in loadSourceAndMetatada -> loadSourceFiles().
404
- const originalSourceAST = withSyncPerformanceMark(
404
+ const originalSourceAST = withSyncPerfMeasurements(
405
'[@babel/parser] parse(originalSourceCode)',
406
() =>
407
parse(originalSourceCode, {
@@ -441,11 +441,11 @@ function parseSourceMaps(
441
442
const sourceMapJSON = hookSourceAndMetadata.sourceMapJSON;
443
if (sourceMapJSON != null) {
444
- hookParsedMetadata.metadataConsumer = withSyncPerformanceMark(
444
+ hookParsedMetadata.metadataConsumer = withSyncPerfMeasurements(
445
'new SourceMapMetadataConsumer(sourceMapJSON)',
446
() => new SourceMapMetadataConsumer(sourceMapJSON),
447
);
448
- hookParsedMetadata.sourceConsumer = withSyncPerformanceMark(
448
+ hookParsedMetadata.sourceConsumer = withSyncPerfMeasurements(
449
'new SourceMapConsumer(sourceMapJSON)',
450
() => new SourceMapConsumer(sourceMapJSON),
451
);