Update ReactDebugInfo types to declare timing info separately

[sebmarkbage]

This clarifies a few things by ensuring that there is always at least one required field. This can be used to refine the object to one of the specific types. However, it's probably just a matter of time until we make this tagged unions instead. E.g. it would be nice to rename the name field ReactComponentInfo to type and tag it with the React Element symbol because then it's just the same as a React Element.

I also extract a time field. The idea is that this will advance (or rewind) the time to the new timestamp and then anything below would be defined as happening within that time stamp. E.g. to model the start and end for a server component you'd do something like:

[
  {time: 123},
  {name: 'Component', ... },
  {time: 124},
]

The reason this needs to be in the ReactDebugInfo is so that timing information from one environment gets transferred into the next environment. It lets you take a Promise from one world and transfer it into another world and its timing information is preserved without everything else being preserved.

I've gone back and forth on if this should be part of each other Info object like ReactComponentInfo but since those can be deduped and can change formats (e.g. this should really just be a React Element) it's better to store this separately.

The time format is relative to a timeOrigin which is the current environment's timeOrigin. When it's serialized between environments this needs to be considered.

Emitting these timings is not yet implemented in this PR.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
react-compiler-playground	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Dec 10, 2024 0:25am

[react-sizebot]

Comparing: 3d2ab01...d25673a

Critical size changes

Includes critical production bundles, as well as any change greater than 2%:

Name	+/-	Base	Current	+/- gzip	Base gzip	Current gzip
oss-stable/react-dom/cjs/react-dom.production.js	=	6.68 kB	6.68 kB	+0.05%	1.82 kB	1.82 kB
oss-stable/react-dom/cjs/react-dom-client.production.js	=	510.81 kB	510.81 kB	=	91.43 kB	91.43 kB
oss-experimental/react-dom/cjs/react-dom.production.js	=	6.69 kB	6.69 kB	+0.05%	1.83 kB	1.83 kB
oss-experimental/react-dom/cjs/react-dom-client.production.js	=	515.74 kB	515.74 kB	=	92.14 kB	92.14 kB
facebook-www/ReactDOM-prod.classic.js	=	595.67 kB	595.67 kB	=	105.14 kB	105.14 kB
facebook-www/ReactDOM-prod.modern.js	=	585.93 kB	585.93 kB	=	103.57 kB	103.57 kB

Significant size changes

Includes any change greater than 0.2%:

Expand to show

Name	+/-	Base	Current	+/- gzip	Base gzip	Current gzip
oss-experimental/react-server-dom-esm/esm/react-server-dom-esm-client.browser.development.js	+0.32%	134.69 kB	135.12 kB	+0.23%	31.30 kB	31.38 kB
oss-stable-rc/react-server-dom-esm/esm/react-server-dom-esm-client.browser.development.js	+0.23%	123.36 kB	123.64 kB	+0.26%	28.50 kB	28.57 kB
oss-stable-semver/react-server-dom-esm/esm/react-server-dom-esm-client.browser.development.js	+0.23%	123.36 kB	123.64 kB	+0.26%	28.50 kB	28.57 kB
oss-stable/react-server-dom-esm/esm/react-server-dom-esm-client.browser.development.js	+0.23%	123.38 kB	123.66 kB	+0.26%	28.52 kB	28.60 kB

Generated by 🚫 dangerJS against 97c0a44

[eps1lon]

Narrowed down some FlowFixMe since Flow doesn't flag now unused $FlowFixMe: ebcf192