Lower case "rsc stream" debug info (#34921)
This is an aesthetic thing. Most simple I/O entries are things like "script", "stylesheet", "fetch" etc. which are all a single word and lower case. The "RSC stream" name sticks out and draws unnecessary attention to itself where as it's really the least interesting to look at. I don't love the name because I'm not sure how to explain it. It's really mainly the byte size of the payload itself without considering things like server awaits things which will have their own cause. So I'm trying to communicate the download size of the stream of downloading the `.rsc` file or the `"rsc stream"`.
Sebastian Markbåge committed
Oct 19, 2025 at 23:42 UTC
21272a680f07cb69873eb3668e7baaebfcf05606
4 files changed
+23
-17
packages/internal-test-utils/debugInfo.js
+2
-2
@@ -64,7 +64,7 @@ function normalizeIOInfo(config: DebugInfoConfig, ioInfo) {
64
if (promise) {
65
promise.then(); // init
66
if (promise.status === 'fulfilled') {
67
- if (ioInfo.name === 'RSC stream') {
67
+ if (ioInfo.name === 'rsc stream') {
68
copy.byteSize = 0;
69
copy.value = {
70
value: 'stream',
@@ -117,7 +117,7 @@ export function getDebugInfo(config: DebugInfoConfig, obj) {
117
for (let i = 0; i < debugInfo.length; i++) {
118
if (
119
debugInfo[i].awaited &&
120
- debugInfo[i].awaited.name === 'RSC stream' &&
120
+ debugInfo[i].awaited.name === 'rsc stream' &&
121
config.ignoreRscStreamInfo
122
) {
123
// Ignore RSC stream I/O info.
packages/react-client/src/ReactFlightClient.js
+1
-1
@@ -2721,7 +2721,7 @@ export function createStreamState(
2721
(debugValuePromise: any).status = 'fulfilled';
2722
(debugValuePromise: any).value = streamDebugValue;
2723
streamState._debugInfo = {
2724
- name: 'RSC stream',
2724
+ name: 'rsc stream',
2725
start: response._debugStartTime,
2726
end: response._debugStartTime, // will be updated once we finish a chunk
2727
byteSize: 0, // will be updated as we resolve a data chunk
packages/react-devtools-shared/src/backend/fiber/renderer.js
+8
-2
@@ -6171,7 +6171,10 @@ export function attach(
6171
}
6172
}
6173
const newIO = asyncInfo.awaited;
6174
- if (newIO.name === 'RSC stream' && newIO.value != null) {
6174
+ if (
6175
+ (newIO.name === 'RSC stream' || newIO.name === 'rsc stream') &&
6176
+ newIO.value != null
6177
+ ) {
6178
const streamPromise = newIO.value;
6179
// Special case RSC stream entries to pick the last entry keyed by the stream.
6180
const existingEntry = streamEntries.get(streamPromise);
@@ -6230,7 +6233,10 @@ export function attach(
6233
continue;
6234
}
6235
foundIOEntries.add(ioInfo);
6233
- if (ioInfo.name === 'RSC stream' && ioInfo.value != null) {
6236
+ if (
6237
+ (ioInfo.name === 'RSC stream' || ioInfo.name === 'rsc stream') &&
6238
+ ioInfo.value != null
6239
+ ) {
6240
const streamPromise = ioInfo.value;
6241
// Special case RSC stream entries to pick the last entry keyed by the stream.
6242
const existingEntry = streamEntries.get(streamPromise);
packages/react-server/src/__tests__/ReactFlightAsyncDebugInfo-test.js
+12
-12
@@ -459,7 +459,7 @@ describe('ReactFlightAsyncDebugInfo', () => {
459
"awaited": {
460
"byteSize": 0,
461
"end": 0,
462
- "name": "RSC stream",
462
+ "name": "rsc stream",
463
"owner": null,
464
"start": 0,
465
"value": {
@@ -867,7 +867,7 @@ describe('ReactFlightAsyncDebugInfo', () => {
867
"awaited": {
868
"byteSize": 0,
869
"end": 0,
870
- "name": "RSC stream",
870
+ "name": "rsc stream",
871
"owner": null,
872
"start": 0,
873
"value": {
@@ -985,7 +985,7 @@ describe('ReactFlightAsyncDebugInfo', () => {
985
"awaited": {
986
"byteSize": 0,
987
"end": 0,
988
- "name": "RSC stream",
988
+ "name": "rsc stream",
989
"owner": null,
990
"start": 0,
991
"value": {
@@ -1460,7 +1460,7 @@ describe('ReactFlightAsyncDebugInfo', () => {
1460
"byteSize": 0,
1461
"end": 0,
1462
"env": "Server",
1463
- "name": "RSC stream",
1463
+ "name": "rsc stream",
1464
"start": 0,
1465
"value": {
1466
"value": "stream",
@@ -1475,7 +1475,7 @@ describe('ReactFlightAsyncDebugInfo', () => {
1475
"awaited": {
1476
"byteSize": 0,
1477
"end": 0,
1478
- "name": "RSC stream",
1478
+ "name": "rsc stream",
1479
"owner": null,
1480
"start": 0,
1481
"value": {
@@ -1789,7 +1789,7 @@ describe('ReactFlightAsyncDebugInfo', () => {
1789
"awaited": {
1790
"byteSize": 0,
1791
"end": 0,
1792
- "name": "RSC stream",
1792
+ "name": "rsc stream",
1793
"owner": null,
1794
"start": 0,
1795
"value": {
@@ -2083,7 +2083,7 @@ describe('ReactFlightAsyncDebugInfo', () => {
2083
"awaited": {
2084
"byteSize": 0,
2085
"end": 0,
2086
- "name": "RSC stream",
2086
+ "name": "rsc stream",
2087
"owner": null,
2088
"start": 0,
2089
"value": {
@@ -2499,7 +2499,7 @@ describe('ReactFlightAsyncDebugInfo', () => {
2499
"awaited": {
2500
"byteSize": 0,
2501
"end": 0,
2502
- "name": "RSC stream",
2502
+ "name": "rsc stream",
2503
"owner": null,
2504
"start": 0,
2505
"value": {
@@ -2665,7 +2665,7 @@ describe('ReactFlightAsyncDebugInfo', () => {
2665
"awaited": {
2666
"byteSize": 0,
2667
"end": 0,
2668
- "name": "RSC stream",
2668
+ "name": "rsc stream",
2669
"owner": null,
2670
"start": 0,
2671
"value": {
@@ -2845,7 +2845,7 @@ describe('ReactFlightAsyncDebugInfo', () => {
2845
"awaited": {
2846
"byteSize": 0,
2847
"end": 0,
2848
- "name": "RSC stream",
2848
+ "name": "rsc stream",
2849
"owner": null,
2850
"start": 0,
2851
"value": {
@@ -3130,7 +3130,7 @@ describe('ReactFlightAsyncDebugInfo', () => {
3130
"awaited": {
3131
"byteSize": 0,
3132
"end": 0,
3133
- "name": "RSC stream",
3133
+ "name": "rsc stream",
3134
"owner": null,
3135
"start": 0,
3136
"value": {
@@ -3275,7 +3275,7 @@ describe('ReactFlightAsyncDebugInfo', () => {
3275
"awaited": {
3276
"byteSize": 0,
3277
"end": 0,
3278
- "name": "RSC stream",
3278
+ "name": "rsc stream",
3279
"owner": null,
3280
"start": 0,
3281
"value": {