[Float][Fizz]: Don't preload nomodule scripts (#26353)

We attempt to preload scripts that we detect during Fizz rendering however when `noModule={true}` we should not because it will force modern browser to fetch scripts they will never execute Hoisted script resources already don't preload because we just emit the resource immediately. This change currently on affects the preloads for scripts that aren't hoistable DiffTrain build for [3706edb](3706edb)
facebook · Mar 9, 2023 · fabd29a · fabd29a
1 parent 6e831f9
commit fabd29a
Show file tree

Hide file tree

Showing 7 changed files with 128 additions and 116 deletions.
diff --git a/compiled/facebook-www/REVISION b/compiled/facebook-www/REVISION
@@ -1 +1 @@
-2b003a5cc6df77f745e1639404f912bd0077a39b
+3706edb81c84ea01e68bfb477537ba9908e1bd70
diff --git a/compiled/facebook-www/ReactDOMServer-dev.classic.js b/compiled/facebook-www/ReactDOMServer-dev.classic.js
@@ -19,7 +19,7 @@ if (__DEV__) {
 var React = require("react");
 var ReactDOM = require("react-dom");
 
-var ReactVersion = "18.3.0-www-classic-ad36e92a";
+var ReactVersion = "18.3.0-www-classic-2aeddbc8";
 
 // This refers to a WWW module.
 var warningWWW = require("warning");
@@ -4516,28 +4516,31 @@ function pushScript(
     var key = getResourceKey("script", src);
 
     if (props.async !== true || props.onLoad || props.onError) {
-      // We can't resourcify scripts with load listeners. To avoid ambiguity with
-      // other Resourcified async scripts on the server we omit them from the server
-      // stream and expect them to be inserted during hydration on the client.
-      // We can still preload them however so the client can start fetching the script
-      // as soon as possible
-      var resource = resources.preloadsMap.get(key);
+      // we don't want to preload nomodule scripts
+      if (props.noModule !== true) {
+        // We can't resourcify scripts with load listeners. To avoid ambiguity with
+        // other Resourcified async scripts on the server we omit them from the server
+        // stream and expect them to be inserted during hydration on the client.
+        // We can still preload them however so the client can start fetching the script
+        // as soon as possible
+        var resource = resources.preloadsMap.get(key);
 
-      if (!resource) {
-        resource = {
-          type: "preload",
-          chunks: [],
-          state: NoState,
-          props: preloadAsScriptPropsFromProps(props.src, props)
-        };
-        resources.preloadsMap.set(key, resource);
+        if (!resource) {
+          resource = {
+            type: "preload",
+            chunks: [],
+            state: NoState,
+            props: preloadAsScriptPropsFromProps(props.src, props)
+          };
+          resources.preloadsMap.set(key, resource);
 
-        {
-          markAsImplicitResourceDEV(resource, props, resource.props);
-        }
+          {
+            markAsImplicitResourceDEV(resource, props, resource.props);
+          }
 
-        resources.usedScripts.add(resource);
-        pushLinkImpl(resource.chunks, resource.props);
+          resources.usedScripts.add(resource);
+          pushLinkImpl(resource.chunks, resource.props);
+        }
       }
 
       if (props.async !== true) {

diff --git a/compiled/facebook-www/ReactDOMServer-dev.modern.js b/compiled/facebook-www/ReactDOMServer-dev.modern.js
@@ -19,7 +19,7 @@ if (__DEV__) {
 var React = require("react");
 var ReactDOM = require("react-dom");
 
-var ReactVersion = "18.3.0-www-modern-4aac2bef";
+var ReactVersion = "18.3.0-www-modern-5ee4e417";
 
 // This refers to a WWW module.
 var warningWWW = require("warning");
@@ -4516,28 +4516,31 @@ function pushScript(
     var key = getResourceKey("script", src);
 
     if (props.async !== true || props.onLoad || props.onError) {
-      // We can't resourcify scripts with load listeners. To avoid ambiguity with
-      // other Resourcified async scripts on the server we omit them from the server
-      // stream and expect them to be inserted during hydration on the client.
-      // We can still preload them however so the client can start fetching the script
-      // as soon as possible
-      var resource = resources.preloadsMap.get(key);
+      // we don't want to preload nomodule scripts
+      if (props.noModule !== true) {
+        // We can't resourcify scripts with load listeners. To avoid ambiguity with
+        // other Resourcified async scripts on the server we omit them from the server
+        // stream and expect them to be inserted during hydration on the client.
+        // We can still preload them however so the client can start fetching the script
+        // as soon as possible
+        var resource = resources.preloadsMap.get(key);
 
-      if (!resource) {
-        resource = {
-          type: "preload",
-          chunks: [],
-          state: NoState,
-          props: preloadAsScriptPropsFromProps(props.src, props)
-        };
-        resources.preloadsMap.set(key, resource);
+        if (!resource) {
+          resource = {
+            type: "preload",
+            chunks: [],
+            state: NoState,
+            props: preloadAsScriptPropsFromProps(props.src, props)
+          };
+          resources.preloadsMap.set(key, resource);
 
-        {
-          markAsImplicitResourceDEV(resource, props, resource.props);
-        }
+          {
+            markAsImplicitResourceDEV(resource, props, resource.props);
+          }
 
-        resources.usedScripts.add(resource);
-        pushLinkImpl(resource.chunks, resource.props);
+          resources.usedScripts.add(resource);
+          pushLinkImpl(resource.chunks, resource.props);
+        }
       }
 
       if (props.async !== true) {

diff --git a/compiled/facebook-www/ReactDOMServer-prod.classic.js b/compiled/facebook-www/ReactDOMServer-prod.classic.js
@@ -928,24 +928,25 @@ function pushStartInstance(
         value = "[script]" + props.src;
         if (!0 !== props.async || props.onLoad || props.onError) {
           if (
-            ((propValue = resources.preloadsMap.get(value)),
-            propValue ||
-              ((propValue = {
-                type: "preload",
-                chunks: [],
-                state: 0,
-                props: {
-                  rel: "preload",
-                  as: "script",
-                  href: props.src,
-                  crossOrigin: props.crossOrigin,
-                  integrity: props.integrity,
-                  referrerPolicy: props.referrerPolicy
-                }
-              }),
-              resources.preloadsMap.set(value, propValue),
-              resources.usedScripts.add(propValue),
-              pushLinkImpl(propValue.chunks, propValue.props)),
+            (!0 !== props.noModule &&
+              ((propValue = resources.preloadsMap.get(value)),
+              propValue ||
+                ((propValue = {
+                  type: "preload",
+                  chunks: [],
+                  state: 0,
+                  props: {
+                    rel: "preload",
+                    as: "script",
+                    href: props.src,
+                    crossOrigin: props.crossOrigin,
+                    integrity: props.integrity,
+                    referrerPolicy: props.referrerPolicy
+                  }
+                }),
+                resources.preloadsMap.set(value, propValue),
+                resources.usedScripts.add(propValue),
+                pushLinkImpl(propValue.chunks, propValue.props))),
             !0 !== props.async)
           ) {
             pushScriptImpl(target, props);
@@ -3778,4 +3779,4 @@ exports.renderToString = function (children, options) {
     'The server used "renderToString" which does not support Suspense. If you intended for this Suspense boundary to render the fallback content on the server consider throwing an Error somewhere within the Suspense boundary. If you intended to have the server wait for the suspended component please switch to "renderToReadableStream" which supports Suspense on the server'
   );
 };
-exports.version = "18.3.0-www-classic-2819a804";
+exports.version = "18.3.0-www-classic-b6382309";
diff --git a/compiled/facebook-www/ReactDOMServer-prod.modern.js b/compiled/facebook-www/ReactDOMServer-prod.modern.js
@@ -927,24 +927,25 @@ function pushStartInstance(
         value = "[script]" + props.src;
         if (!0 !== props.async || props.onLoad || props.onError) {
           if (
-            ((propValue = resources.preloadsMap.get(value)),
-            propValue ||
-              ((propValue = {
-                type: "preload",
-                chunks: [],
-                state: 0,
-                props: {
-                  rel: "preload",
-                  as: "script",
-                  href: props.src,
-                  crossOrigin: props.crossOrigin,
-                  integrity: props.integrity,
-                  referrerPolicy: props.referrerPolicy
-                }
-              }),
-              resources.preloadsMap.set(value, propValue),
-              resources.usedScripts.add(propValue),
-              pushLinkImpl(propValue.chunks, propValue.props)),
+            (!0 !== props.noModule &&
+              ((propValue = resources.preloadsMap.get(value)),
+              propValue ||
+                ((propValue = {
+                  type: "preload",
+                  chunks: [],
+                  state: 0,
+                  props: {
+                    rel: "preload",
+                    as: "script",
+                    href: props.src,
+                    crossOrigin: props.crossOrigin,
+                    integrity: props.integrity,
+                    referrerPolicy: props.referrerPolicy
+                  }
+                }),
+                resources.preloadsMap.set(value, propValue),
+                resources.usedScripts.add(propValue),
+                pushLinkImpl(propValue.chunks, propValue.props))),
             !0 !== props.async)
           ) {
             pushScriptImpl(target, props);
@@ -3676,4 +3677,4 @@ exports.renderToString = function (children, options) {
     'The server used "renderToString" which does not support Suspense. If you intended for this Suspense boundary to render the fallback content on the server consider throwing an Error somewhere within the Suspense boundary. If you intended to have the server wait for the suspended component please switch to "renderToReadableStream" which supports Suspense on the server'
   );
 };
-exports.version = "18.3.0-www-modern-8b165abc";
+exports.version = "18.3.0-www-modern-b0c73d05";
diff --git a/compiled/facebook-www/ReactDOMServerStreaming-dev.modern.js b/compiled/facebook-www/ReactDOMServerStreaming-dev.modern.js
@@ -4523,28 +4523,31 @@ function pushScript(
     var key = getResourceKey("script", src);
 
     if (props.async !== true || props.onLoad || props.onError) {
-      // We can't resourcify scripts with load listeners. To avoid ambiguity with
-      // other Resourcified async scripts on the server we omit them from the server
-      // stream and expect them to be inserted during hydration on the client.
-      // We can still preload them however so the client can start fetching the script
-      // as soon as possible
-      var resource = resources.preloadsMap.get(key);
+      // we don't want to preload nomodule scripts
+      if (props.noModule !== true) {
+        // We can't resourcify scripts with load listeners. To avoid ambiguity with
+        // other Resourcified async scripts on the server we omit them from the server
+        // stream and expect them to be inserted during hydration on the client.
+        // We can still preload them however so the client can start fetching the script
+        // as soon as possible
+        var resource = resources.preloadsMap.get(key);
 
-      if (!resource) {
-        resource = {
-          type: "preload",
-          chunks: [],
-          state: NoState,
-          props: preloadAsScriptPropsFromProps(props.src, props)
-        };
-        resources.preloadsMap.set(key, resource);
+        if (!resource) {
+          resource = {
+            type: "preload",
+            chunks: [],
+            state: NoState,
+            props: preloadAsScriptPropsFromProps(props.src, props)
+          };
+          resources.preloadsMap.set(key, resource);
 
-        {
-          markAsImplicitResourceDEV(resource, props, resource.props);
-        }
+          {
+            markAsImplicitResourceDEV(resource, props, resource.props);
+          }
 
-        resources.usedScripts.add(resource);
-        pushLinkImpl(resource.chunks, resource.props);
+          resources.usedScripts.add(resource);
+          pushLinkImpl(resource.chunks, resource.props);
+        }
       }
 
       if (props.async !== true) {

diff --git a/compiled/facebook-www/ReactDOMServerStreaming-prod.modern.js b/compiled/facebook-www/ReactDOMServerStreaming-prod.modern.js
@@ -949,24 +949,25 @@ function pushStartInstance(
         value = "[script]" + props.src;
         if (!0 !== props.async || props.onLoad || props.onError) {
           if (
-            ((propValue = resources.preloadsMap.get(value)),
-            propValue ||
-              ((propValue = {
-                type: "preload",
-                chunks: [],
-                state: 0,
-                props: {
-                  rel: "preload",
-                  as: "script",
-                  href: props.src,
-                  crossOrigin: props.crossOrigin,
-                  integrity: props.integrity,
-                  referrerPolicy: props.referrerPolicy
-                }
-              }),
-              resources.preloadsMap.set(value, propValue),
-              resources.usedScripts.add(propValue),
-              pushLinkImpl(propValue.chunks, propValue.props)),
+            (!0 !== props.noModule &&
+              ((propValue = resources.preloadsMap.get(value)),
+              propValue ||
+                ((propValue = {
+                  type: "preload",
+                  chunks: [],
+                  state: 0,
+                  props: {
+                    rel: "preload",
+                    as: "script",
+                    href: props.src,
+                    crossOrigin: props.crossOrigin,
+                    integrity: props.integrity,
+                    referrerPolicy: props.referrerPolicy
+                  }
+                }),
+                resources.preloadsMap.set(value, propValue),
+                resources.usedScripts.add(propValue),
+                pushLinkImpl(propValue.chunks, propValue.props))),
             !0 !== props.async)
           ) {
             pushScriptImpl(target, props);
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		2b003a5cc6df77f745e1639404f912bd0077a39b
		3706edb81c84ea01e68bfb477537ba9908e1bd70