Skip to content

Commit 51c558a

Browse files
author
Brian Vaughn
authored
Rename (some) "scheduling profiler" references to "timeline" (#22690)
1 parent 255221c commit 51c558a

File tree

20 files changed

+158
-168
lines changed

20 files changed

+158
-168
lines changed

‎packages/react-devtools-extensions/src/main.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -152,7 +152,7 @@ function createPanelIfReactLoaded() {
152152
isProfiling,
153153
supportsReloadAndProfile: isChrome || isEdge,
154154
supportsProfiling,
155-
// At this time, the scheduling profiler can only parse Chrome performance profiles.
155+
// At this time, the timeline can only parse Chrome performance profiles.
156156
supportsSchedulingProfiler: isChrome,
157157
supportsTraceUpdates: true,
158158
});

‎packages/react-devtools-scheduling-profiler/README.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,3 @@
11
# React Concurrent Mode Profiler
22

3-
This package contains the new/experimental "scheduling profiler" for React 18. This profiler exists as its own project because it was initially deployed as a standalone app. It has since been moved into the DevTools Profiler under the "Scheduling" tab. This package will likely eventually be moved into `react-devtools-shared`.
3+
This package contains the new/experimental "timeline" for React 18. This profiler exists as its own project because it was initially deployed as a standalone app. It has since been moved into the DevTools Profiler under the "Scheduling" tab. This package will likely eventually be moved into `react-devtools-shared`.

‎packages/react-devtools-scheduling-profiler/src/content-views/constants.js‎

Lines changed: 40 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -109,86 +109,82 @@ export function updateColorsToMatchTheme(element: Element): boolean {
109109
COLORS = {
110110
BACKGROUND: computedStyle.getPropertyValue('--color-background'),
111111
INTERNAL_MODULE_FRAME: computedStyle.getPropertyValue(
112-
'--color-scheduling-profiler-internal-module',
112+
'--color-timeline-internal-module',
113113
),
114114
INTERNAL_MODULE_FRAME_HOVER: computedStyle.getPropertyValue(
115-
'--color-scheduling-profiler-internal-module-hover',
115+
'--color-timeline-internal-module-hover',
116116
),
117117
INTERNAL_MODULE_FRAME_TEXT: computedStyle.getPropertyValue(
118-
'--color-scheduling-profiler-internal-module-text',
118+
'--color-timeline-internal-module-text',
119119
),
120120
NATIVE_EVENT: computedStyle.getPropertyValue(
121-
'--color-scheduling-profiler-native-event',
121+
'--color-timeline-native-event',
122122
),
123123
NATIVE_EVENT_HOVER: computedStyle.getPropertyValue(
124-
'--color-scheduling-profiler-native-event-hover',
124+
'--color-timeline-native-event-hover',
125125
),
126126
NETWORK_PRIMARY: computedStyle.getPropertyValue(
127-
'--color-scheduling-profiler-network-primary',
127+
'--color-timeline-network-primary',
128128
),
129129
NETWORK_PRIMARY_HOVER: computedStyle.getPropertyValue(
130-
'--color-scheduling-profiler-network-primary-hover',
130+
'--color-timeline-network-primary-hover',
131131
),
132132
NETWORK_SECONDARY: computedStyle.getPropertyValue(
133-
'--color-scheduling-profiler-network-secondary',
133+
'--color-timeline-network-secondary',
134134
),
135135
NETWORK_SECONDARY_HOVER: computedStyle.getPropertyValue(
136-
'--color-scheduling-profiler-network-secondary-hover',
136+
'--color-timeline-network-secondary-hover',
137137
),
138138
PRIORITY_BACKGROUND: computedStyle.getPropertyValue(
139-
'--color-scheduling-profiler-priority-background',
139+
'--color-timeline-priority-background',
140140
),
141141
PRIORITY_BORDER: computedStyle.getPropertyValue(
142-
'--color-scheduling-profiler-priority-border',
142+
'--color-timeline-priority-border',
143143
),
144144
PRIORITY_LABEL: computedStyle.getPropertyValue('--color-text'),
145-
USER_TIMING: computedStyle.getPropertyValue(
146-
'--color-scheduling-profiler-user-timing',
147-
),
145+
USER_TIMING: computedStyle.getPropertyValue('--color-timeline-user-timing'),
148146
USER_TIMING_HOVER: computedStyle.getPropertyValue(
149-
'--color-scheduling-profiler-user-timing-hover',
150-
),
151-
REACT_IDLE: computedStyle.getPropertyValue(
152-
'--color-scheduling-profiler-react-idle',
147+
'--color-timeline-user-timing-hover',
153148
),
149+
REACT_IDLE: computedStyle.getPropertyValue('--color-timeline-react-idle'),
154150
REACT_IDLE_HOVER: computedStyle.getPropertyValue(
155-
'--color-scheduling-profiler-react-idle-hover',
151+
'--color-timeline-react-idle-hover',
156152
),
157153
REACT_RENDER: computedStyle.getPropertyValue(
158-
'--color-scheduling-profiler-react-render',
154+
'--color-timeline-react-render',
159155
),
160156
REACT_RENDER_HOVER: computedStyle.getPropertyValue(
161-
'--color-scheduling-profiler-react-render-hover',
157+
'--color-timeline-react-render-hover',
162158
),
163159
REACT_RENDER_TEXT: computedStyle.getPropertyValue(
164-
'--color-scheduling-profiler-react-render-text',
160+
'--color-timeline-react-render-text',
165161
),
166162
REACT_COMMIT: computedStyle.getPropertyValue(
167-
'--color-scheduling-profiler-react-commit',
163+
'--color-timeline-react-commit',
168164
),
169165
REACT_COMMIT_HOVER: computedStyle.getPropertyValue(
170-
'--color-scheduling-profiler-react-commit-hover',
166+
'--color-timeline-react-commit-hover',
171167
),
172168
REACT_COMMIT_TEXT: computedStyle.getPropertyValue(
173-
'--color-scheduling-profiler-react-commit-text',
169+
'--color-timeline-react-commit-text',
174170
),
175171
REACT_LAYOUT_EFFECTS: computedStyle.getPropertyValue(
176-
'--color-scheduling-profiler-react-layout-effects',
172+
'--color-timeline-react-layout-effects',
177173
),
178174
REACT_LAYOUT_EFFECTS_HOVER: computedStyle.getPropertyValue(
179-
'--color-scheduling-profiler-react-layout-effects-hover',
175+
'--color-timeline-react-layout-effects-hover',
180176
),
181177
REACT_LAYOUT_EFFECTS_TEXT: computedStyle.getPropertyValue(
182-
'--color-scheduling-profiler-react-layout-effects-text',
178+
'--color-timeline-react-layout-effects-text',
183179
),
184180
REACT_PASSIVE_EFFECTS: computedStyle.getPropertyValue(
185-
'--color-scheduling-profiler-react-passive-effects',
181+
'--color-timeline-react-passive-effects',
186182
),
187183
REACT_PASSIVE_EFFECTS_HOVER: computedStyle.getPropertyValue(
188-
'--color-scheduling-profiler-react-passive-effects-hover',
184+
'--color-timeline-react-passive-effects-hover',
189185
),
190186
REACT_PASSIVE_EFFECTS_TEXT: computedStyle.getPropertyValue(
191-
'--color-scheduling-profiler-react-passive-effects-text',
187+
'--color-timeline-react-passive-effects-text',
192188
),
193189
REACT_RESIZE_BAR: computedStyle.getPropertyValue('--color-resize-bar'),
194190
REACT_RESIZE_BAR_ACTIVE: computedStyle.getPropertyValue(
@@ -201,44 +197,42 @@ export function updateColorsToMatchTheme(element: Element): boolean {
201197
'--color-resize-bar-dot',
202198
),
203199
REACT_SCHEDULE: computedStyle.getPropertyValue(
204-
'--color-scheduling-profiler-react-schedule',
200+
'--color-timeline-react-schedule',
205201
),
206202
REACT_SCHEDULE_HOVER: computedStyle.getPropertyValue(
207-
'--color-scheduling-profiler-react-schedule-hover',
203+
'--color-timeline-react-schedule-hover',
208204
),
209205
REACT_SUSPENSE_REJECTED_EVENT: computedStyle.getPropertyValue(
210-
'--color-scheduling-profiler-react-suspense-rejected',
206+
'--color-timeline-react-suspense-rejected',
211207
),
212208
REACT_SUSPENSE_REJECTED_EVENT_HOVER: computedStyle.getPropertyValue(
213-
'--color-scheduling-profiler-react-suspense-rejected-hover',
209+
'--color-timeline-react-suspense-rejected-hover',
214210
),
215211
REACT_SUSPENSE_RESOLVED_EVENT: computedStyle.getPropertyValue(
216-
'--color-scheduling-profiler-react-suspense-resolved',
212+
'--color-timeline-react-suspense-resolved',
217213
),
218214
REACT_SUSPENSE_RESOLVED_EVENT_HOVER: computedStyle.getPropertyValue(
219-
'--color-scheduling-profiler-react-suspense-resolved-hover',
215+
'--color-timeline-react-suspense-resolved-hover',
220216
),
221217
REACT_SUSPENSE_UNRESOLVED_EVENT: computedStyle.getPropertyValue(
222-
'--color-scheduling-profiler-react-suspense-unresolved',
218+
'--color-timeline-react-suspense-unresolved',
223219
),
224220
REACT_SUSPENSE_UNRESOLVED_EVENT_HOVER: computedStyle.getPropertyValue(
225-
'--color-scheduling-profiler-react-suspense-unresolved-hover',
221+
'--color-timeline-react-suspense-unresolved-hover',
226222
),
227223
REACT_THROWN_ERROR: computedStyle.getPropertyValue(
228-
'--color-scheduling-profiler-thrown-error',
224+
'--color-timeline-thrown-error',
229225
),
230226
REACT_THROWN_ERROR_HOVER: computedStyle.getPropertyValue(
231-
'--color-scheduling-profiler-thrown-error-hover',
227+
'--color-timeline-thrown-error-hover',
232228
),
233229
REACT_WORK_BORDER: computedStyle.getPropertyValue(
234-
'--color-scheduling-profiler-react-work-border',
230+
'--color-timeline-react-work-border',
235231
),
236232
SCROLL_CARET: computedStyle.getPropertyValue('--color-scroll-caret'),
237-
TEXT_COLOR: computedStyle.getPropertyValue(
238-
'--color-scheduling-profiler-text-color',
239-
),
233+
TEXT_COLOR: computedStyle.getPropertyValue('--color-timeline-text-color'),
240234
TEXT_DIM_COLOR: computedStyle.getPropertyValue(
241-
'--color-scheduling-profiler-text-dim-color',
235+
'--color-timeline-text-dim-color',
242236
),
243237
TIME_MARKER_LABEL: computedStyle.getPropertyValue('--color-text'),
244238
WARNING_BACKGROUND: computedStyle.getPropertyValue(

‎packages/react-devtools-scheduling-profiler/src/import-worker/preprocessData.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -575,7 +575,7 @@ function processTimelineEvent(
575575
}
576576
}
577577

578-
// TODO (scheduling profiler) Maybe we should calculate depth in post,
578+
// TODO (timeline) Maybe we should calculate depth in post,
579579
// so unresolved Suspense requests don't take up space.
580580
// We can't know if they'll be resolved or not at this point.
581581
// We'll just give them a default (fake) duration width.

‎packages/react-devtools-shared/src/backend/types.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -420,7 +420,7 @@ export type DevToolsHook = {
420420
didError?: boolean,
421421
) => void,
422422

423-
// Scheduling Profiler internal module filtering
423+
// Timeline internal module filtering
424424
getInternalModuleRanges: () => Array<[string, string]>,
425425
registerInternalModuleStart: (moduleStartError: Error) => void,
426426
registerInternalModuleStop: (moduleStopError: Error) => void,

‎packages/react-devtools-shared/src/constants.js‎

Lines changed: 80 additions & 80 deletions
Original file line numberDiff line numberDiff line change
@@ -154,46 +154,46 @@ export const THEME_STYLES: {[style: Theme | DisplayDensity]: any} = {
154154
'--color-resize-bar-active': '#dcdcdc',
155155
'--color-resize-bar-border': '#d1d1d1',
156156
'--color-resize-bar-dot': '#333333',
157-
'--color-scheduling-profiler-internal-module': '#d1d1d1',
158-
'--color-scheduling-profiler-internal-module-hover': '#c9c9c9',
159-
'--color-scheduling-profiler-internal-module-text': '#444',
160-
'--color-scheduling-profiler-native-event': '#ccc',
161-
'--color-scheduling-profiler-native-event-hover': '#aaa',
162-
'--color-scheduling-profiler-network-primary': '#fcf3dc',
163-
'--color-scheduling-profiler-network-primary-hover': '#f0e7d1',
164-
'--color-scheduling-profiler-network-secondary': '#efc457',
165-
'--color-scheduling-profiler-network-secondary-hover': '#e3ba52',
166-
'--color-scheduling-profiler-priority-background': '#f6f6f6',
167-
'--color-scheduling-profiler-priority-border': '#eeeeee',
168-
'--color-scheduling-profiler-user-timing': '#c9cacd',
169-
'--color-scheduling-profiler-user-timing-hover': '#93959a',
170-
'--color-scheduling-profiler-react-idle': '#d3e5f6',
171-
'--color-scheduling-profiler-react-idle-hover': '#c3d9ef',
172-
'--color-scheduling-profiler-react-render': '#9fc3f3',
173-
'--color-scheduling-profiler-react-render-hover': '#83afe9',
174-
'--color-scheduling-profiler-react-render-text': '#11365e',
175-
'--color-scheduling-profiler-react-commit': '#c88ff0',
176-
'--color-scheduling-profiler-react-commit-hover': '#b281d6',
177-
'--color-scheduling-profiler-react-commit-text': '#3e2c4a',
178-
'--color-scheduling-profiler-react-layout-effects': '#b281d6',
179-
'--color-scheduling-profiler-react-layout-effects-hover': '#9d71bd',
180-
'--color-scheduling-profiler-react-layout-effects-text': '#3e2c4a',
181-
'--color-scheduling-profiler-react-passive-effects': '#b281d6',
182-
'--color-scheduling-profiler-react-passive-effects-hover': '#9d71bd',
183-
'--color-scheduling-profiler-react-passive-effects-text': '#3e2c4a',
184-
'--color-scheduling-profiler-react-schedule': '#9fc3f3',
185-
'--color-scheduling-profiler-react-schedule-hover': '#2683E2',
186-
'--color-scheduling-profiler-react-suspense-rejected': '#f1cc14',
187-
'--color-scheduling-profiler-react-suspense-rejected-hover': '#ffdf37',
188-
'--color-scheduling-profiler-react-suspense-resolved': '#a6e59f',
189-
'--color-scheduling-profiler-react-suspense-resolved-hover': '#89d281',
190-
'--color-scheduling-profiler-react-suspense-unresolved': '#c9cacd',
191-
'--color-scheduling-profiler-react-suspense-unresolved-hover': '#93959a',
192-
'--color-scheduling-profiler-thrown-error': '#ee1638',
193-
'--color-scheduling-profiler-thrown-error-hover': '#da1030',
194-
'--color-scheduling-profiler-text-color': '#000000',
195-
'--color-scheduling-profiler-text-dim-color': '#ccc',
196-
'--color-scheduling-profiler-react-work-border': '#eeeeee',
157+
'--color-timeline-internal-module': '#d1d1d1',
158+
'--color-timeline-internal-module-hover': '#c9c9c9',
159+
'--color-timeline-internal-module-text': '#444',
160+
'--color-timeline-native-event': '#ccc',
161+
'--color-timeline-native-event-hover': '#aaa',
162+
'--color-timeline-network-primary': '#fcf3dc',
163+
'--color-timeline-network-primary-hover': '#f0e7d1',
164+
'--color-timeline-network-secondary': '#efc457',
165+
'--color-timeline-network-secondary-hover': '#e3ba52',
166+
'--color-timeline-priority-background': '#f6f6f6',
167+
'--color-timeline-priority-border': '#eeeeee',
168+
'--color-timeline-user-timing': '#c9cacd',
169+
'--color-timeline-user-timing-hover': '#93959a',
170+
'--color-timeline-react-idle': '#d3e5f6',
171+
'--color-timeline-react-idle-hover': '#c3d9ef',
172+
'--color-timeline-react-render': '#9fc3f3',
173+
'--color-timeline-react-render-hover': '#83afe9',
174+
'--color-timeline-react-render-text': '#11365e',
175+
'--color-timeline-react-commit': '#c88ff0',
176+
'--color-timeline-react-commit-hover': '#b281d6',
177+
'--color-timeline-react-commit-text': '#3e2c4a',
178+
'--color-timeline-react-layout-effects': '#b281d6',
179+
'--color-timeline-react-layout-effects-hover': '#9d71bd',
180+
'--color-timeline-react-layout-effects-text': '#3e2c4a',
181+
'--color-timeline-react-passive-effects': '#b281d6',
182+
'--color-timeline-react-passive-effects-hover': '#9d71bd',
183+
'--color-timeline-react-passive-effects-text': '#3e2c4a',
184+
'--color-timeline-react-schedule': '#9fc3f3',
185+
'--color-timeline-react-schedule-hover': '#2683E2',
186+
'--color-timeline-react-suspense-rejected': '#f1cc14',
187+
'--color-timeline-react-suspense-rejected-hover': '#ffdf37',
188+
'--color-timeline-react-suspense-resolved': '#a6e59f',
189+
'--color-timeline-react-suspense-resolved-hover': '#89d281',
190+
'--color-timeline-react-suspense-unresolved': '#c9cacd',
191+
'--color-timeline-react-suspense-unresolved-hover': '#93959a',
192+
'--color-timeline-thrown-error': '#ee1638',
193+
'--color-timeline-thrown-error-hover': '#da1030',
194+
'--color-timeline-text-color': '#000000',
195+
'--color-timeline-text-dim-color': '#ccc',
196+
'--color-timeline-react-work-border': '#eeeeee',
197197
'--color-search-match': 'yellow',
198198
'--color-search-match-current': '#f7923b',
199199
'--color-selected-tree-highlight-active': 'rgba(0, 136, 250, 0.1)',
@@ -298,46 +298,46 @@ export const THEME_STYLES: {[style: Theme | DisplayDensity]: any} = {
298298
'--color-resize-bar-active': '#31363f',
299299
'--color-resize-bar-border': '#3d424a',
300300
'--color-resize-bar-dot': '#cfd1d5',
301-
'--color-scheduling-profiler-internal-module': '#303542',
302-
'--color-scheduling-profiler-internal-module-hover': '#363b4a',
303-
'--color-scheduling-profiler-internal-module-text': '#7f8899',
304-
'--color-scheduling-profiler-native-event': '#b2b2b2',
305-
'--color-scheduling-profiler-native-event-hover': '#949494',
306-
'--color-scheduling-profiler-network-primary': '#fcf3dc',
307-
'--color-scheduling-profiler-network-primary-hover': '#e3dbc5',
308-
'--color-scheduling-profiler-network-secondary': '#efc457',
309-
'--color-scheduling-profiler-network-secondary-hover': '#d6af4d',
310-
'--color-scheduling-profiler-priority-background': '#1d2129',
311-
'--color-scheduling-profiler-priority-border': '#282c34',
312-
'--color-scheduling-profiler-user-timing': '#c9cacd',
313-
'--color-scheduling-profiler-user-timing-hover': '#93959a',
314-
'--color-scheduling-profiler-react-idle': '#3d485b',
315-
'--color-scheduling-profiler-react-idle-hover': '#465269',
316-
'--color-scheduling-profiler-react-render': '#2683E2',
317-
'--color-scheduling-profiler-react-render-hover': '#1a76d4',
318-
'--color-scheduling-profiler-react-render-text': '#11365e',
319-
'--color-scheduling-profiler-react-commit': '#731fad',
320-
'--color-scheduling-profiler-react-commit-hover': '#611b94',
321-
'--color-scheduling-profiler-react-commit-text': '#e5c1ff',
322-
'--color-scheduling-profiler-react-layout-effects': '#611b94',
323-
'--color-scheduling-profiler-react-layout-effects-hover': '#51167a',
324-
'--color-scheduling-profiler-react-layout-effects-text': '#e5c1ff',
325-
'--color-scheduling-profiler-react-passive-effects': '#611b94',
326-
'--color-scheduling-profiler-react-passive-effects-hover': '#51167a',
327-
'--color-scheduling-profiler-react-passive-effects-text': '#e5c1ff',
328-
'--color-scheduling-profiler-react-schedule': '#2683E2',
329-
'--color-scheduling-profiler-react-schedule-hover': '#1a76d4',
330-
'--color-scheduling-profiler-react-suspense-rejected': '#f1cc14',
331-
'--color-scheduling-profiler-react-suspense-rejected-hover': '#e4c00f',
332-
'--color-scheduling-profiler-react-suspense-resolved': '#a6e59f',
333-
'--color-scheduling-profiler-react-suspense-resolved-hover': '#89d281',
334-
'--color-scheduling-profiler-react-suspense-unresolved': '#c9cacd',
335-
'--color-scheduling-profiler-react-suspense-unresolved-hover': '#93959a',
336-
'--color-scheduling-profiler-thrown-error': '#fb3655',
337-
'--color-scheduling-profiler-thrown-error-hover': '#f82042',
338-
'--color-scheduling-profiler-text-color': '#282c34',
339-
'--color-scheduling-profiler-text-dim-color': '#555b66',
340-
'--color-scheduling-profiler-react-work-border': '#3d424a',
301+
'--color-timeline-internal-module': '#303542',
302+
'--color-timeline-internal-module-hover': '#363b4a',
303+
'--color-timeline-internal-module-text': '#7f8899',
304+
'--color-timeline-native-event': '#b2b2b2',
305+
'--color-timeline-native-event-hover': '#949494',
306+
'--color-timeline-network-primary': '#fcf3dc',
307+
'--color-timeline-network-primary-hover': '#e3dbc5',
308+
'--color-timeline-network-secondary': '#efc457',
309+
'--color-timeline-network-secondary-hover': '#d6af4d',
310+
'--color-timeline-priority-background': '#1d2129',
311+
'--color-timeline-priority-border': '#282c34',
312+
'--color-timeline-user-timing': '#c9cacd',
313+
'--color-timeline-user-timing-hover': '#93959a',
314+
'--color-timeline-react-idle': '#3d485b',
315+
'--color-timeline-react-idle-hover': '#465269',
316+
'--color-timeline-react-render': '#2683E2',
317+
'--color-timeline-react-render-hover': '#1a76d4',
318+
'--color-timeline-react-render-text': '#11365e',
319+
'--color-timeline-react-commit': '#731fad',
320+
'--color-timeline-react-commit-hover': '#611b94',
321+
'--color-timeline-react-commit-text': '#e5c1ff',
322+
'--color-timeline-react-layout-effects': '#611b94',
323+
'--color-timeline-react-layout-effects-hover': '#51167a',
324+
'--color-timeline-react-layout-effects-text': '#e5c1ff',
325+
'--color-timeline-react-passive-effects': '#611b94',
326+
'--color-timeline-react-passive-effects-hover': '#51167a',
327+
'--color-timeline-react-passive-effects-text': '#e5c1ff',
328+
'--color-timeline-react-schedule': '#2683E2',
329+
'--color-timeline-react-schedule-hover': '#1a76d4',
330+
'--color-timeline-react-suspense-rejected': '#f1cc14',
331+
'--color-timeline-react-suspense-rejected-hover': '#e4c00f',
332+
'--color-timeline-react-suspense-resolved': '#a6e59f',
333+
'--color-timeline-react-suspense-resolved-hover': '#89d281',
334+
'--color-timeline-react-suspense-unresolved': '#c9cacd',
335+
'--color-timeline-react-suspense-unresolved-hover': '#93959a',
336+
'--color-timeline-thrown-error': '#fb3655',
337+
'--color-timeline-thrown-error-hover': '#f82042',
338+
'--color-timeline-text-color': '#282c34',
339+
'--color-timeline-text-dim-color': '#555b66',
340+
'--color-timeline-react-work-border': '#3d424a',
341341
'--color-search-match': 'yellow',
342342
'--color-search-match-current': '#f7923b',
343343
'--color-selected-tree-highlight-active': 'rgba(23, 143, 185, 0.15)',

0 commit comments

Comments
 (0)