From 97c90ed8835401e325e42de22f38a803c5e6fc6d Mon Sep 17 00:00:00 2001 From: Josh Story Date: Mon, 8 Apr 2024 13:54:30 -0700 Subject: [PATCH] [DOM] Shrink ReactDOMCurrentDispatcher method names (#28770) Stacked on #28771 ReactDOMCurrentDispatcher has longer property names for various methods. These methods are only ever called internally and don't need to be represented with as many characters. This change shortens the names and aligns them with the hint codes we use in Flight. This alignment is passive since not all dispatcher methods will exist as flight instructions but where they can line up it seems reasonable to make them do so --- .../src/client/ReactFiberConfigDOM.js | 34 ++++++++-------- .../ReactDOMFlightServerHostDispatcher.js | 30 +++++++------- .../src/server/ReactFizzConfigDOM.js | 30 +++++++------- .../src/shared/ReactFlightClientConfigDOM.js | 40 +++++++++---------- .../react-dom/src/ReactDOMSharedInternals.js | 16 ++++---- .../src/ReactDOMSharedInternalsFB.js | 16 ++++---- .../react-dom/src/shared/ReactDOMFloat.js | 19 ++++----- .../react-dom/src/shared/ReactDOMFlushSync.js | 2 +- .../react-dom/src/shared/ReactDOMTypes.js | 23 +++++++---- 9 files changed, 109 insertions(+), 101 deletions(-) diff --git a/packages/react-dom-bindings/src/client/ReactFiberConfigDOM.js b/packages/react-dom-bindings/src/client/ReactFiberConfigDOM.js index a12ce0c6ac29c..ef718516b19fa 100644 --- a/packages/react-dom-bindings/src/client/ReactFiberConfigDOM.js +++ b/packages/react-dom-bindings/src/client/ReactFiberConfigDOM.js @@ -1925,21 +1925,21 @@ function getDocumentFromRoot(root: HoistableRoot): Document { const previousDispatcher = ReactDOMSharedInternals.d; /* ReactDOMCurrentDispatcher */ ReactDOMSharedInternals.d /* ReactDOMCurrentDispatcher */ = { - flushSyncWork: disableLegacyMode + f /* flushSyncWork */: disableLegacyMode ? flushSyncWork - : previousDispatcher.flushSyncWork, - prefetchDNS, - preconnect, - preload, - preloadModule, - preinitStyle, - preinitScript, - preinitModuleScript, + : previousDispatcher.f /* flushSyncWork */, + D /* prefetchDNS */: prefetchDNS, + C /* preconnect */: preconnect, + L /* preload */: preload, + m /* preloadModule */: preloadModule, + X /* preinitScript */: preinitScript, + S /* preinitStyle */: preinitStyle, + M /* preinitModuleScript */: preinitModuleScript, }; function flushSyncWork() { if (disableLegacyMode) { - const previousWasRendering = previousDispatcher.flushSyncWork(); + const previousWasRendering = previousDispatcher.f(); /* flushSyncWork */ const wasRendering = flushSyncWorkOnAllRoots(); // Since multiple dispatchers can flush sync work during a single flushSync call // we need to return true if any of them were rendering. @@ -1990,17 +1990,17 @@ function preconnectAs( } function prefetchDNS(href: string) { - previousDispatcher.prefetchDNS(href); + previousDispatcher.D(/* prefetchDNS */ href); preconnectAs('dns-prefetch', href, null); } function preconnect(href: string, crossOrigin?: ?CrossOriginEnum) { - previousDispatcher.preconnect(href, crossOrigin); + previousDispatcher.C(/* preconnect */ href, crossOrigin); preconnectAs('preconnect', href, crossOrigin); } function preload(href: string, as: string, options?: ?PreloadImplOptions) { - previousDispatcher.preload(href, as, options); + previousDispatcher.L(/* preload */ href, as, options); const ownerDocument = getGlobalDocument(); if (ownerDocument && href && as) { let preloadSelector = `link[rel="preload"][as="${escapeSelectorAttributeValueInsideDoubleQuotes( @@ -2078,7 +2078,7 @@ function preload(href: string, as: string, options?: ?PreloadImplOptions) { } function preloadModule(href: string, options?: ?PreloadModuleImplOptions) { - previousDispatcher.preloadModule(href, options); + previousDispatcher.m(/* preloadModule */ href, options); const ownerDocument = getGlobalDocument(); if (ownerDocument && href) { const as = @@ -2139,7 +2139,7 @@ function preinitStyle( precedence: ?string, options?: ?PreinitStyleOptions, ) { - previousDispatcher.preinitStyle(href, precedence, options); + previousDispatcher.S(/* preinitStyle */ href, precedence, options); const ownerDocument = getGlobalDocument(); if (ownerDocument && href) { @@ -2213,7 +2213,7 @@ function preinitStyle( } function preinitScript(src: string, options?: ?PreinitScriptOptions) { - previousDispatcher.preinitScript(src, options); + previousDispatcher.X(/* preinitScript */ src, options); const ownerDocument = getGlobalDocument(); if (ownerDocument && src) { @@ -2269,7 +2269,7 @@ function preinitModuleScript( src: string, options?: ?PreinitModuleScriptOptions, ) { - previousDispatcher.preinitModuleScript(src, options); + previousDispatcher.M(/* preinitModuleScript */ src, options); const ownerDocument = getGlobalDocument(); if (ownerDocument && src) { diff --git a/packages/react-dom-bindings/src/server/ReactDOMFlightServerHostDispatcher.js b/packages/react-dom-bindings/src/server/ReactDOMFlightServerHostDispatcher.js index 6e722abcc7159..602452f67e2f3 100644 --- a/packages/react-dom-bindings/src/server/ReactDOMFlightServerHostDispatcher.js +++ b/packages/react-dom-bindings/src/server/ReactDOMFlightServerHostDispatcher.js @@ -27,14 +27,14 @@ import ReactDOMSharedInternals from 'shared/ReactDOMSharedInternals'; const previousDispatcher = ReactDOMSharedInternals.d; /* ReactDOMCurrentDispatcher */ ReactDOMSharedInternals.d /* ReactDOMCurrentDispatcher */ = { - flushSyncWork: previousDispatcher.flushSyncWork, - prefetchDNS, - preconnect, - preload, - preloadModule, - preinitStyle, - preinitScript, - preinitModuleScript, + f /* flushSyncWork */: previousDispatcher.f /* flushSyncWork */, + D /* prefetchDNS */: prefetchDNS, + C /* preconnect */: preconnect, + L /* preload */: preload, + m /* preloadModule */: preloadModule, + X /* preinitScript */: preinitScript, + S /* preinitStyle */: preinitStyle, + M /* preinitModuleScript */: preinitModuleScript, }; function prefetchDNS(href: string) { @@ -50,7 +50,7 @@ function prefetchDNS(href: string) { hints.add(key); emitHint(request, 'D', href); } else { - previousDispatcher.prefetchDNS(href); + previousDispatcher.D(/* prefetchDNS */ href); } } } @@ -73,7 +73,7 @@ function preconnect(href: string, crossOrigin?: ?CrossOriginEnum) { emitHint(request, 'C', href); } } else { - previousDispatcher.preconnect(href, crossOrigin); + previousDispatcher.C(/* preconnect */ href, crossOrigin); } } } @@ -106,7 +106,7 @@ function preload(href: string, as: string, options?: ?PreloadImplOptions) { emitHint(request, 'L', [href, as]); } } else { - previousDispatcher.preload(href, as, options); + previousDispatcher.L(/* preload */ href, as, options); } } } @@ -130,7 +130,7 @@ function preloadModule(href: string, options?: ?PreloadModuleImplOptions) { return emitHint(request, 'm', href); } } else { - previousDispatcher.preloadModule(href, options); + previousDispatcher.m(/* preloadModule */ href, options); } } } @@ -164,7 +164,7 @@ function preinitStyle( return emitHint(request, 'S', href); } } else { - previousDispatcher.preinitStyle(href, precedence, options); + previousDispatcher.S(/* preinitStyle */ href, precedence, options); } } } @@ -188,7 +188,7 @@ function preinitScript(src: string, options?: ?PreinitScriptOptions) { return emitHint(request, 'X', src); } } else { - previousDispatcher.preinitScript(src, options); + previousDispatcher.X(/* preinitScript */ src, options); } } } @@ -215,7 +215,7 @@ function preinitModuleScript( return emitHint(request, 'M', src); } } else { - previousDispatcher.preinitModuleScript(src, options); + previousDispatcher.M(/* preinitModuleScript */ src, options); } } } diff --git a/packages/react-dom-bindings/src/server/ReactFizzConfigDOM.js b/packages/react-dom-bindings/src/server/ReactFizzConfigDOM.js index bbf93cbd47829..91baeef4a1bff 100644 --- a/packages/react-dom-bindings/src/server/ReactFizzConfigDOM.js +++ b/packages/react-dom-bindings/src/server/ReactFizzConfigDOM.js @@ -87,14 +87,14 @@ import ReactDOMSharedInternals from 'shared/ReactDOMSharedInternals'; const previousDispatcher = ReactDOMSharedInternals.d; /* ReactDOMCurrentDispatcher */ ReactDOMSharedInternals.d /* ReactDOMCurrentDispatcher */ = { - flushSyncWork: previousDispatcher.flushSyncWork, - prefetchDNS, - preconnect, - preload, - preloadModule, - preinitScript, - preinitStyle, - preinitModuleScript, + f /* flushSyncWork */: previousDispatcher.f /* flushSyncWork */, + D /* prefetchDNS */: prefetchDNS, + C /* preconnect */: preconnect, + L /* preload */: preload, + m /* preloadModule */: preloadModule, + X /* preinitScript */: preinitScript, + S /* preinitStyle */: preinitStyle, + M /* preinitModuleScript */: preinitModuleScript, }; // We make every property of the descriptor optional because it is not a contract that @@ -5266,7 +5266,7 @@ function prefetchDNS(href: string) { // the resources for this call in either case we opt to do nothing. We can consider making this a warning // but there may be times where calling a function outside of render is intentional (i.e. to warm up data // fetching) and we don't want to warn in those cases. - previousDispatcher.prefetchDNS(href); + previousDispatcher.D(/* prefetchDNS */ href); return; } const resumableState = getResumableState(request); @@ -5319,7 +5319,7 @@ function preconnect(href: string, crossOrigin: ?CrossOriginEnum) { // the resources for this call in either case we opt to do nothing. We can consider making this a warning // but there may be times where calling a function outside of render is intentional (i.e. to warm up data // fetching) and we don't want to warn in those cases. - previousDispatcher.preconnect(href, crossOrigin); + previousDispatcher.C(/* preconnect */ href, crossOrigin); return; } const resumableState = getResumableState(request); @@ -5380,7 +5380,7 @@ function preload(href: string, as: string, options?: ?PreloadImplOptions) { // the resources for this call in either case we opt to do nothing. We can consider making this a warning // but there may be times where calling a function outside of render is intentional (i.e. to warm up data // fetching) and we don't want to warn in those cases. - previousDispatcher.preload(href, as, options); + previousDispatcher.L(/* preload */ href, as, options); return; } const resumableState = getResumableState(request); @@ -5581,7 +5581,7 @@ function preloadModule( // the resources for this call in either case we opt to do nothing. We can consider making this a warning // but there may be times where calling a function outside of render is intentional (i.e. to warm up data // fetching) and we don't want to warn in those cases. - previousDispatcher.preloadModule(href, options); + previousDispatcher.m(/* preloadModule */ href, options); return; } const resumableState = getResumableState(request); @@ -5655,7 +5655,7 @@ function preinitStyle( // the resources for this call in either case we opt to do nothing. We can consider making this a warning // but there may be times where calling a function outside of render is intentional (i.e. to warm up data // fetching) and we don't want to warn in those cases. - previousDispatcher.preinitStyle(href, precedence, options); + previousDispatcher.S(/* preinitStyle */ href, precedence, options); return; } const resumableState = getResumableState(request); @@ -5740,7 +5740,7 @@ function preinitScript(src: string, options?: ?PreinitScriptOptions): void { // the resources for this call in either case we opt to do nothing. We can consider making this a warning // but there may be times where calling a function outside of render is intentional (i.e. to warm up data // fetching) and we don't want to warn in those cases. - previousDispatcher.preinitScript(src, options); + previousDispatcher.X(/* preinitScript */ src, options); return; } const resumableState = getResumableState(request); @@ -5803,7 +5803,7 @@ function preinitModuleScript( // the resources for this call in either case we opt to do nothing. We can consider making this a warning // but there may be times where calling a function outside of render is intentional (i.e. to warm up data // fetching) and we don't want to warn in those cases. - previousDispatcher.preinitModuleScript(src, options); + previousDispatcher.M(/* preinitModuleScript */ src, options); return; } const resumableState = getResumableState(request); diff --git a/packages/react-dom-bindings/src/shared/ReactFlightClientConfigDOM.js b/packages/react-dom-bindings/src/shared/ReactFlightClientConfigDOM.js index 17c7007e10632..ee54c274bfc54 100644 --- a/packages/react-dom-bindings/src/shared/ReactFlightClientConfigDOM.js +++ b/packages/react-dom-bindings/src/shared/ReactFlightClientConfigDOM.js @@ -25,18 +25,18 @@ export function dispatchHint( case 'D': { const refined = refineModel(code, model); const href = refined; - dispatcher.prefetchDNS(href); + dispatcher.D(/* prefetchDNS */ href); return; } case 'C': { const refined = refineModel(code, model); if (typeof refined === 'string') { const href = refined; - dispatcher.preconnect(href); + dispatcher.C(/* preconnect */ href); } else { const href = refined[0]; const crossOrigin = refined[1]; - dispatcher.preconnect(href, crossOrigin); + dispatcher.C(/* preconnect */ href, crossOrigin); } return; } @@ -46,9 +46,9 @@ export function dispatchHint( const as = refined[1]; if (refined.length === 3) { const options = refined[2]; - dispatcher.preload(href, as, options); + dispatcher.L(/* preload */ href, as, options); } else { - dispatcher.preload(href, as); + dispatcher.L(/* preload */ href, as); } return; } @@ -56,36 +56,36 @@ export function dispatchHint( const refined = refineModel(code, model); if (typeof refined === 'string') { const href = refined; - dispatcher.preloadModule(href); + dispatcher.m(/* preloadModule */ href); } else { const href = refined[0]; const options = refined[1]; - dispatcher.preloadModule(href, options); + dispatcher.m(/* preloadModule */ href, options); } return; } - case 'S': { + case 'X': { const refined = refineModel(code, model); if (typeof refined === 'string') { const href = refined; - dispatcher.preinitStyle(href); + dispatcher.X(/* preinitScript */ href); } else { const href = refined[0]; - const precedence = refined[1] === 0 ? undefined : refined[1]; - const options = refined.length === 3 ? refined[2] : undefined; - dispatcher.preinitStyle(href, precedence, options); + const options = refined[1]; + dispatcher.X(/* preinitScript */ href, options); } return; } - case 'X': { + case 'S': { const refined = refineModel(code, model); if (typeof refined === 'string') { const href = refined; - dispatcher.preinitScript(href); + dispatcher.S(/* preinitStyle */ href); } else { const href = refined[0]; - const options = refined[1]; - dispatcher.preinitScript(href, options); + const precedence = refined[1] === 0 ? undefined : refined[1]; + const options = refined.length === 3 ? refined[2] : undefined; + dispatcher.S(/* preinitStyle */ href, precedence, options); } return; } @@ -93,11 +93,11 @@ export function dispatchHint( const refined = refineModel(code, model); if (typeof refined === 'string') { const href = refined; - dispatcher.preinitModuleScript(href); + dispatcher.M(/* preinitModuleScript */ href); } else { const href = refined[0]; const options = refined[1]; - dispatcher.preinitModuleScript(href, options); + dispatcher.M(/* preinitModuleScript */ href, options); } return; } @@ -116,7 +116,7 @@ export function preinitModuleForSSR( crossOrigin: ?string, ) { ReactDOMSharedInternals.d /* ReactDOMCurrentDispatcher */ - .preinitModuleScript(href, { + .M(/* preinitModuleScript */ href, { crossOrigin: getCrossOriginString(crossOrigin), nonce, }); @@ -128,7 +128,7 @@ export function preinitScriptForSSR( crossOrigin: ?string, ) { ReactDOMSharedInternals.d /* ReactDOMCurrentDispatcher */ - .preinitScript(href, { + .X(/* preinitScript */ href, { crossOrigin: getCrossOriginString(crossOrigin), nonce, }); diff --git a/packages/react-dom/src/ReactDOMSharedInternals.js b/packages/react-dom/src/ReactDOMSharedInternals.js index 58cc3e4cb1919..b9b1c07b8361c 100644 --- a/packages/react-dom/src/ReactDOMSharedInternals.js +++ b/packages/react-dom/src/ReactDOMSharedInternals.js @@ -30,14 +30,14 @@ export type ReactDOMInternalsDev = ReactDOMInternals & { function noop() {} const DefaultDispatcher: HostDispatcher = { - flushSyncWork: noop, - prefetchDNS: noop, - preconnect: noop, - preload: noop, - preloadModule: noop, - preinitScript: noop, - preinitStyle: noop, - preinitModuleScript: noop, + f /* flushSyncWork */: noop, + D /* prefetchDNS */: noop, + C /* preconnect */: noop, + L /* preload */: noop, + m /* preloadModule */: noop, + X /* preinitScript */: noop, + S /* preinitStyle */: noop, + M /* preinitModuleScript */: noop, }; const Internals: ReactDOMInternals = { diff --git a/packages/react-dom/src/ReactDOMSharedInternalsFB.js b/packages/react-dom/src/ReactDOMSharedInternalsFB.js index a49ba3bcca182..7bd7a1ab8ae2b 100644 --- a/packages/react-dom/src/ReactDOMSharedInternalsFB.js +++ b/packages/react-dom/src/ReactDOMSharedInternalsFB.js @@ -26,14 +26,14 @@ type ReactDOMInternals = { function noop() {} const DefaultDispatcher: HostDispatcher = { - flushSyncWork: noop, - prefetchDNS: noop, - preconnect: noop, - preload: noop, - preloadModule: noop, - preinitScript: noop, - preinitStyle: noop, - preinitModuleScript: noop, + f /* flushSyncWork */: noop, + D /* prefetchDNS */: noop, + C /* preconnect */: noop, + L /* preload */: noop, + m /* preloadModule */: noop, + X /* preinitScript */: noop, + S /* preinitStyle */: noop, + M /* preinitModuleScript */: noop, }; const Internals: ReactDOMInternals = { diff --git a/packages/react-dom/src/shared/ReactDOMFloat.js b/packages/react-dom/src/shared/ReactDOMFloat.js index 4277c91603c43..f83508714f10a 100644 --- a/packages/react-dom/src/shared/ReactDOMFloat.js +++ b/packages/react-dom/src/shared/ReactDOMFloat.js @@ -48,7 +48,7 @@ export function prefetchDNS(href: string) { } if (typeof href === 'string') { ReactDOMSharedInternals.d /* ReactDOMCurrentDispatcher */ - .prefetchDNS(href); + .D(/* prefetchDNS */ href); } // We don't error because preconnect needs to be resilient to being called in a variety of scopes // and the runtime may not be capable of responding. The function is optimistic and not critical @@ -79,7 +79,7 @@ export function preconnect(href: string, options?: ?PreconnectOptions) { ? getCrossOriginString(options.crossOrigin) : null; ReactDOMSharedInternals.d /* ReactDOMCurrentDispatcher */ - .preconnect(href, crossOrigin); + .C(/* preconnect */ href, crossOrigin); } // We don't error because preconnect needs to be resilient to being called in a variety of scopes // and the runtime may not be capable of responding. The function is optimistic and not critical @@ -120,7 +120,7 @@ export function preload(href: string, options: PreloadOptions) { const as = options.as; const crossOrigin = getCrossOriginStringAs(as, options.crossOrigin); ReactDOMSharedInternals.d /* ReactDOMCurrentDispatcher */ - .preload(href, as, { + .L(/* preload */ href, as, { crossOrigin, integrity: typeof options.integrity === 'string' ? options.integrity : undefined, @@ -181,7 +181,7 @@ export function preloadModule(href: string, options?: ?PreloadModuleOptions) { options.crossOrigin, ); ReactDOMSharedInternals.d /* ReactDOMCurrentDispatcher */ - .preloadModule(href, { + .m(/* preloadModule */ href, { as: typeof options.as === 'string' && options.as !== 'script' ? options.as @@ -194,7 +194,7 @@ export function preloadModule(href: string, options?: ?PreloadModuleOptions) { }); } else { ReactDOMSharedInternals.d /* ReactDOMCurrentDispatcher */ - .preloadModule(href); + .m(/* preloadModule */ href); } } // We don't error because preload needs to be resilient to being called in a variety of scopes @@ -232,7 +232,8 @@ export function preinit(href: string, options: PreinitOptions) { : undefined; if (as === 'style') { ReactDOMSharedInternals.d /* ReactDOMCurrentDispatcher */ - .preinitStyle( + .S( + /* preinitStyle */ href, typeof options.precedence === 'string' ? options.precedence @@ -245,7 +246,7 @@ export function preinit(href: string, options: PreinitOptions) { ); } else if (as === 'script') { ReactDOMSharedInternals.d /* ReactDOMCurrentDispatcher */ - .preinitScript(href, { + .X(/* preinitScript */ href, { crossOrigin, integrity, fetchPriority, @@ -311,7 +312,7 @@ export function preinitModule(href: string, options?: ?PreinitModuleOptions) { options.crossOrigin, ); ReactDOMSharedInternals.d /* ReactDOMCurrentDispatcher */ - .preinitModuleScript(href, { + .M(/* preinitModuleScript */ href, { crossOrigin, integrity: typeof options.integrity === 'string' @@ -323,7 +324,7 @@ export function preinitModule(href: string, options?: ?PreinitModuleOptions) { } } else if (options == null) { ReactDOMSharedInternals.d /* ReactDOMCurrentDispatcher */ - .preinitModuleScript(href); + .M(/* preinitModuleScript */ href); } } // We don't error because preinit needs to be resilient to being called in a variety of scopes diff --git a/packages/react-dom/src/shared/ReactDOMFlushSync.js b/packages/react-dom/src/shared/ReactDOMFlushSync.js index 626e063aed946..c81e35c7e7d5a 100644 --- a/packages/react-dom/src/shared/ReactDOMFlushSync.js +++ b/packages/react-dom/src/shared/ReactDOMFlushSync.js @@ -40,7 +40,7 @@ function flushSyncImpl(fn: (() => R) | void): R | void { previousUpdatePriority; const wasInRender = ReactDOMSharedInternals.d /* ReactDOMCurrentDispatcher */ - .flushSyncWork(); + .f(); /* flushSyncWork */ if (__DEV__) { if (wasInRender) { console.error( diff --git a/packages/react-dom/src/shared/ReactDOMTypes.js b/packages/react-dom/src/shared/ReactDOMTypes.js index 515825cad29be..2da68cae2d3f3 100644 --- a/packages/react-dom/src/shared/ReactDOMTypes.js +++ b/packages/react-dom/src/shared/ReactDOMTypes.js @@ -82,18 +82,25 @@ export type PreinitModuleScriptOptions = { }; export type HostDispatcher = { - flushSyncWork: () => boolean | void, - prefetchDNS: (href: string) => void, - preconnect: (href: string, crossOrigin?: ?CrossOriginEnum) => void, - preload: (href: string, as: string, options?: ?PreloadImplOptions) => void, - preloadModule: (href: string, options?: ?PreloadModuleImplOptions) => void, - preinitStyle: ( + f /* flushSyncWork */: () => boolean | void, + D /* prefetchDNS */: (href: string) => void, + C /* preconnect */: (href: string, crossOrigin?: ?CrossOriginEnum) => void, + L /* preload */: ( + href: string, + as: string, + options?: ?PreloadImplOptions, + ) => void, + m /* preloadModule */: ( + href: string, + options?: ?PreloadModuleImplOptions, + ) => void, + S /* preinitStyle */: ( href: string, precedence: ?string, options?: ?PreinitStyleOptions, ) => void, - preinitScript: (src: string, options?: ?PreinitScriptOptions) => void, - preinitModuleScript: ( + X /* preinitScript */: (src: string, options?: ?PreinitScriptOptions) => void, + M /* preinitModuleScript */: ( src: string, options?: ?PreinitModuleScriptOptions, ) => void,