next/script fix duplicate scripts #28428

janicklas-ralph · 2021-08-24T01:09:22Z

Bug

fixes Duplicating Google Maps API with "beforeInteractive" script component #28036
Integration tests added

test/integration/script-loader/test/index.test.js

ijjk · 2021-08-24T15:08:31Z

Stats from current PR

Default Build (Increase detected ⚠️)

General Overall increase ⚠️

	vercel/next.js canary	janicklas-ralph/next.js script	Change
buildDuration	15s	15.2s	⚠️ +225ms
buildDurationCached	3.5s	3.3s	-204ms
nodeModulesSize	61.7 MB	61.7 MB	⚠️ +789 B

Page Load Tests Overall increase ✓

	vercel/next.js canary	janicklas-ralph/next.js script	Change
/ failed reqs	0	0	✓
/ total time (seconds)	3.015	2.92	-0.1
/ avg req/sec	829.06	856.18	+27.12
/error-in-render failed reqs	0	0	✓
/error-in-render total time (seconds)	1.778	1.776	0
/error-in-render avg req/sec	1406.43	1407.84	+1.41

Client Bundles (main, webpack, commons) Overall increase ⚠️

	vercel/next.js canary	janicklas-ralph/next.js script	Change
745.HASH.js gzip	179 B	179 B	✓
framework-HASH.js gzip	42.2 kB	42.2 kB	✓
main-HASH.js gzip	23.3 kB	23.3 kB	⚠️ +40 B
webpack-HASH.js gzip	1.45 kB	1.45 kB	✓
Overall change	67.1 kB	67.2 kB	⚠️ +40 B

Legacy Client Bundles (polyfills)

	vercel/next.js canary	janicklas-ralph/next.js script	Change
polyfills-a4..dd70.js gzip	31 kB	31 kB	✓
Overall change	31 kB	31 kB	✓

Client Pages

	vercel/next.js canary	janicklas-ralph/next.js script	Change
_app-HASH.js gzip	979 B	979 B	✓
_error-HASH.js gzip	194 B	194 B	✓
amp-HASH.js gzip	312 B	312 B	✓
css-HASH.js gzip	329 B	329 B	✓
dynamic-HASH.js gzip	2.67 kB	2.67 kB	✓
head-HASH.js gzip	351 B	351 B	✓
hooks-HASH.js gzip	918 B	918 B	✓
image-HASH.js gzip	4.14 kB	4.14 kB	✓
index-HASH.js gzip	261 B	261 B	✓
link-HASH.js gzip	1.66 kB	1.66 kB	✓
routerDirect..HASH.js gzip	318 B	318 B	✓
script-HASH.js gzip	387 B	387 B	✓
withRouter-HASH.js gzip	320 B	320 B	✓
bb14e60e810b..30f.css gzip	125 B	125 B	✓
Overall change	13 kB	13 kB	✓

Client Build Manifests

	vercel/next.js canary	janicklas-ralph/next.js script	Change
_buildManifest.js gzip	491 B	491 B	✓
Overall change	491 B	491 B	✓

Rendered Page Sizes Overall increase ⚠️

	vercel/next.js canary	janicklas-ralph/next.js script	Change
index.html gzip	540 B	540 B	✓
link.html gzip	552 B	552 B	✓
withRouter.html gzip	533 B	534 B	⚠️ +1 B
Overall change	1.63 kB	1.63 kB	⚠️ +1 B

Diffs

Diff for main-HASH.js

@@ -1176,6 +1176,10 @@
       exports.router = router;
       var CachedApp, onPerfEntry;
 
+      headManager.getIsSsr = function() {
+        return router.isSsr;
+      };
+
       var Container = /*#__PURE__*/ (function(_react$default$Compon) {
         _inherits(Container, _react$default$Compon);
 
@@ -3441,7 +3445,8 @@
             _headManagerContext.HeadManagerContext
           ),
           updateScripts = _useContext.updateScripts,
-          scripts = _useContext.scripts;
+          scripts = _useContext.scripts,
+          getIsSsr = _useContext.getIsSsr;
 
         (0, _react).useEffect(
           function() {
@@ -3469,7 +3474,10 @@
               )
             ]);
             updateScripts(scripts);
-          } else {
+          } else if (getIsSsr && getIsSsr()) {
+            // Script has already loaded during SSR
+            LoadCache.add(restProps.id || src);
+          } else if (getIsSsr && !getIsSsr()) {
             loadScript(props);
           }
         }

Diff for index.html

@@ -19,7 +19,7 @@
       defer=""
     ></script>
     <script
-      src="/_next/static/chunks/main-71848fe942d276705802.js"
+      src="/_next/static/chunks/main-61fd645a50080708f8b7.js"
       defer=""
     ></script>
     <script

Diff for link.html

@@ -19,7 +19,7 @@
       defer=""
     ></script>
     <script
-      src="/_next/static/chunks/main-71848fe942d276705802.js"
+      src="/_next/static/chunks/main-61fd645a50080708f8b7.js"
       defer=""
     ></script>
     <script

Diff for withRouter.html

@@ -19,7 +19,7 @@
       defer=""
     ></script>
     <script
-      src="/_next/static/chunks/main-71848fe942d276705802.js"
+      src="/_next/static/chunks/main-61fd645a50080708f8b7.js"
       defer=""
     ></script>
     <script

Webpack 4 Mode (Increase detected ⚠️)

General Overall increase ⚠️

	vercel/next.js canary	janicklas-ralph/next.js script	Change
buildDuration	12.5s	12.5s	-7ms
buildDurationCached	5.3s	5.3s	-35ms
nodeModulesSize	61.7 MB	61.7 MB	⚠️ +789 B

Page Load Tests Overall decrease ⚠️

	vercel/next.js canary	janicklas-ralph/next.js script	Change
/ failed reqs	0	0	✓
/ total time (seconds)	2.851	2.868	⚠️ +0.02
/ avg req/sec	876.98	871.76	⚠️ -5.22
/error-in-render failed reqs	0	0	✓
/error-in-render total time (seconds)	1.829	1.862	⚠️ +0.03
/error-in-render avg req/sec	1367	1342.55	⚠️ -24.45

Client Bundles (main, webpack, commons) Overall increase ⚠️

	vercel/next.js canary	janicklas-ralph/next.js script	Change
16.HASH.js gzip	186 B	186 B	✓
677f882d2ed8..HASH.js gzip	14.1 kB	14.1 kB	✓
framework.HASH.js gzip	41.9 kB	41.9 kB	✓
main-HASH.js gzip	10.6 kB	10.7 kB	⚠️ +38 B
webpack-HASH.js gzip	1.19 kB	1.19 kB	✓
Overall change	68 kB	68.1 kB	⚠️ +38 B

Legacy Client Bundles (polyfills)

	vercel/next.js canary	janicklas-ralph/next.js script	Change
polyfills-a4..dd70.js gzip	31 kB	31 kB	✓
Overall change	31 kB	31 kB	✓

Client Pages Overall increase ⚠️

	vercel/next.js canary	janicklas-ralph/next.js script	Change
_app-HASH.js gzip	964 B	964 B	✓
_error-HASH.js gzip	3.8 kB	3.8 kB	✓
amp-HASH.js gzip	552 B	552 B	✓
css-HASH.js gzip	333 B	333 B	✓
dynamic-HASH.js gzip	2.87 kB	2.87 kB	✓
head-HASH.js gzip	3.06 kB	3.06 kB	✓
hooks-HASH.js gzip	924 B	924 B	✓
index-HASH.js gzip	231 B	231 B	✓
link-HASH.js gzip	1.64 kB	1.64 kB	✓
routerDirect..HASH.js gzip	298 B	298 B	✓
script-HASH.js gzip	3 kB	3.03 kB	⚠️ +27 B
withRouter-HASH.js gzip	295 B	295 B	✓
30809af5c834..565.css gzip	125 B	125 B	✓
Overall change	18.1 kB	18.1 kB	⚠️ +27 B

Client Build Manifests Overall decrease ✓

	vercel/next.js canary	janicklas-ralph/next.js script	Change
_buildManifest.js gzip	501 B	500 B	-1 B
Overall change	501 B	500 B	-1 B

Rendered Page Sizes Overall increase ⚠️

	vercel/next.js canary	janicklas-ralph/next.js script	Change
index.html gzip	584 B	585 B	⚠️ +1 B
link.html gzip	597 B	597 B	✓
withRouter.html gzip	578 B	579 B	⚠️ +1 B
Overall change	1.76 kB	1.76 kB	⚠️ +2 B

Diffs

Diff for _buildManifest.js

@@ -21,7 +21,7 @@ self.__BUILD_MANIFEST = {
     "static\u002Fchunks\u002Fpages\u002FrouterDirect-50fd45536deb174654c1.js"
   ],
   "/script": [
-    "static\u002Fchunks\u002Fpages\u002Fscript-6d080d3c0355db6a774e.js"
+    "static\u002Fchunks\u002Fpages\u002Fscript-0e954095d9a175e25af6.js"
   ],
   "/withRouter": [
     "static\u002Fchunks\u002Fpages\u002FwithRouter-0fffa173b4934d0b86a2.js"

Diff for script-HASH.js

@@ -281,7 +281,8 @@ _N_E = (window["webpackJsonp_N_E"] = window["webpackJsonp_N_E"] || []).push([
             _headManagerContext.HeadManagerContext
           ),
           updateScripts = _useContext.updateScripts,
-          scripts = _useContext.scripts;
+          scripts = _useContext.scripts,
+          getIsSsr = _useContext.getIsSsr;
 
         (0, _react).useEffect(
           function() {
@@ -309,7 +310,10 @@ _N_E = (window["webpackJsonp_N_E"] = window["webpackJsonp_N_E"] || []).push([
               )
             ]);
             updateScripts(scripts);
-          } else {
+          } else if (getIsSsr && getIsSsr()) {
+            // Script has already loaded during SSR
+            LoadCache.add(restProps.id || src);
+          } else if (getIsSsr && !getIsSsr()) {
             loadScript(props);
           }
         }

Diff for main-HASH.js

@@ -863,7 +863,8 @@ _N_E = (window["webpackJsonp_N_E"] = window["webpackJsonp_N_E"] || []).push([
             _headManagerContext.HeadManagerContext
           ),
           updateScripts = _useContext.updateScripts,
-          scripts = _useContext.scripts;
+          scripts = _useContext.scripts,
+          getIsSsr = _useContext.getIsSsr;
 
         (0, _react).useEffect(
           function() {
@@ -891,7 +892,10 @@ _N_E = (window["webpackJsonp_N_E"] = window["webpackJsonp_N_E"] || []).push([
               )
             ]);
             updateScripts(scripts);
-          } else {
+          } else if (getIsSsr && getIsSsr()) {
+            // Script has already loaded during SSR
+            LoadCache.add(restProps.id || src);
+          } else if (getIsSsr && !getIsSsr()) {
             loadScript(props);
           }
         }
@@ -1651,6 +1655,10 @@ _N_E = (window["webpackJsonp_N_E"] = window["webpackJsonp_N_E"] || []).push([
       exports.router = router;
       var CachedApp, onPerfEntry;
 
+      headManager.getIsSsr = function() {
+        return router.isSsr;
+      };
+
       var Container = /*#__PURE__*/ (function(_react$default$Compon) {
         _inherits(Container, _react$default$Compon);

Diff for index.html

@@ -23,7 +23,7 @@
       defer=""
     ></script>
     <script
-      src="/_next/static/chunks/main-980e559e4dfaea1bd63d.js"
+      src="/_next/static/chunks/main-3b40b973bd5d89b3eecf.js"
       defer=""
     ></script>
     <script

Diff for link.html

@@ -23,7 +23,7 @@
       defer=""
     ></script>
     <script
-      src="/_next/static/chunks/main-980e559e4dfaea1bd63d.js"
+      src="/_next/static/chunks/main-3b40b973bd5d89b3eecf.js"
       defer=""
     ></script>
     <script

Diff for withRouter.html

@@ -23,7 +23,7 @@
       defer=""
     ></script>
     <script
-      src="/_next/static/chunks/main-980e559e4dfaea1bd63d.js"
+      src="/_next/static/chunks/main-3b40b973bd5d89b3eecf.js"
       defer=""
     ></script>
     <script

Commit: 36fe787

janicklas-ralph and others added 10 commits August 9, 2021 15:19

Fix vercel#27747

5491d12

Fix lint error

0e5fab1

Merge branch 'canary' of github.com:vercel/next.js into script

1c77210

Merge branch 'canary' of github.com:vercel/next.js into script

11c14e4

Add data attribute to script component

7924509

Merge branch 'canary' of github.com:vercel/next.js into script

9218a66

Merge branch 'canary' into script

4e1f75e

Fix vercel#28036

cd0e873

Merge branch 'canary' of github.com:vercel/next.js into script

2773eb8

Merge branch 'script' of github.com:janicklas-ralph/next.js into script

8304841

janicklas-ralph requested review from huozhi, ijjk, padmaia, shuding, styfle and timneutkens as code owners August 24, 2021 01:09

ijjk added created-by: Chrome Aurora PRs by the Google Chrome team: https://web.dev/aurora type: next labels Aug 24, 2021

This comment has been minimized.

Sign in to view

ijjk reviewed Aug 24, 2021

View reviewed changes

test/integration/script-loader/test/index.test.js Outdated Show resolved Hide resolved

This comment has been minimized.

Sign in to view

janicklas-ralph added 3 commits August 24, 2021 00:05

Fix tests

e1002e9

Fix tests

38ff970

Merge branch 'canary' of github.com:vercel/next.js into script

41b228d

janicklas-ralph requested a review from ijjk August 24, 2021 07:11

This comment has been minimized.

Sign in to view

ijjk approved these changes Aug 24, 2021

View reviewed changes

Merge branch 'canary' into script

36fe787

This comment has been minimized.

Sign in to view

ijjk merged commit fd1c56e into vercel:canary Aug 24, 2021

sync-by-unito bot mentioned this pull request Sep 1, 2021

chore(deps): bump next from 11.1.0 to 11.1.1 filecoin-project/slate#916

Closed

janicklas-ralph deleted the script branch September 7, 2021 08:24

This was referenced Sep 17, 2021

Duplicating script component when using rewrite rule in config.next.js #28538

Closed

AB#6495 Integrate Sitecore CDP with basic page view logs Sitecore/Sitecore.Demo.Edge#115

Merged

arempe93 added a commit to arempe93/weather that referenced this pull request Oct 4, 2021

update next to 11.1.2; ref: vercel/next.js#28428

ea803ac

vercel locked as resolved and limited conversation to collaborators Jan 27, 2022

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

next/script fix duplicate scripts #28428

next/script fix duplicate scripts #28428

janicklas-ralph commented Aug 24, 2021 •

edited

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

ijjk commented Aug 24, 2021

Diffs

Diffs

This comment has been minimized.

next/script fix duplicate scripts #28428

next/script fix duplicate scripts #28428

Conversation

janicklas-ralph commented Aug 24, 2021 • edited

Bug

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

ijjk commented Aug 24, 2021

Stats from current PR

Diffs

Diffs

This comment has been minimized.

janicklas-ralph commented Aug 24, 2021 •

edited