Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Switch from defer to async #10143

Merged
merged 2 commits into from Jan 17, 2020
Merged

Switch from defer to async #10143

merged 2 commits into from Jan 17, 2020

Conversation

Timer
Copy link
Member

@Timer Timer commented Jan 17, 2020

This switches scripts back to async from defer.

@Timer Timer added this to the 9.2.1 milestone Jan 17, 2020
@ijjk
Copy link
Member

ijjk commented Jan 17, 2020

Stats from current PR

Default Server Mode
General
zeit/next.js canary Timer/next.js hotfix/defer-async Change
buildDuration 13.9s 13.9s ⚠️ +32ms
nodeModulesSize 48.9 MB 48.9 MB ✓
Client Bundles (main, webpack, commons)
zeit/next.js canary Timer/next.js hotfix/defer-async Change
main-HASH.js gzip 5.11 kB 5.11 kB ✓
webpack-HASH.js gzip 746 B 746 B ✓
4952ddcd88e7..54d3.js gzip 4.68 kB 4.68 kB ✓
commons.HASH.js gzip 4.06 kB 4.06 kB ✓
de003c3a9d30..8249.js gzip 13.7 kB 13.7 kB ✓
framework.HASH.js gzip 39.1 kB 39.1 kB ✓
Overall change 67.5 kB 67.5 kB ✓
Client Bundles (main, webpack, commons) Modern
zeit/next.js canary Timer/next.js hotfix/defer-async Change
main-HASH.module.js gzip 4.17 kB 4.17 kB ✓
webpack-HASH..dule.js gzip 746 B 746 B ✓
4952ddcd88e7..dule.js gzip 5.56 kB 5.56 kB ✓
de003c3a9d30..dule.js gzip 12.5 kB 12.5 kB ✓
framework.HA..dule.js gzip 39.1 kB 39.1 kB ✓
Overall change 62.1 kB 62.1 kB ✓
Legacy Client Bundles (polyfills)
zeit/next.js canary Timer/next.js hotfix/defer-async Change
polyfills-HASH.js gzip 4.76 kB 4.76 kB ✓
Overall change 4.76 kB 4.76 kB ✓
Client Pages
zeit/next.js canary Timer/next.js hotfix/defer-async Change
_app.js gzip 1.33 kB 1.33 kB ✓
_error.js gzip 4.07 kB 4.07 kB ✓
hooks.js gzip 779 B 779 B ✓
index.js gzip 222 B 222 B ✓
link.js gzip 2.9 kB 2.9 kB ✓
routerDirect.js gzip 283 B 283 B ✓
withRouter.js gzip 282 B 282 B ✓
Overall change 9.87 kB 9.87 kB ✓
Client Pages Modern
zeit/next.js canary Timer/next.js hotfix/defer-async Change
_app.module.js gzip 757 B 757 B ✓
_error.module.js gzip 3.06 kB 3.06 kB ✓
hooks.module.js gzip 371 B 371 B ✓
index.module.js gzip 212 B 212 B ✓
link.module.js gzip 2.47 kB 2.47 kB ✓
routerDirect..dule.js gzip 273 B 273 B ✓
withRouter.m..dule.js gzip 272 B 272 B ✓
Overall change 7.41 kB 7.41 kB ✓
Client Build Manifests
zeit/next.js canary Timer/next.js hotfix/defer-async Change
_buildManifest.js gzip 61 B 61 B ✓
_buildManife..dule.js gzip 61 B 61 B ✓
Overall change 122 B 122 B ✓
Rendered Page Sizes Overall increase ⚠️
zeit/next.js canary Timer/next.js hotfix/defer-async Change
index.html gzip 1.02 kB 1.02 kB ⚠️ +2 B
link.html gzip 1.03 kB 1.03 kB ⚠️ +1 B
withRouter.html gzip 1.02 kB 1.02 kB ⚠️ +2 B
Overall change 3.07 kB 3.08 kB ⚠️ +5 B

Diffs

Diff for index.html 
@@ -81,28 +81,28 @@
       src="/_next/static/runtime/polyfills-355bc4b3077ea9d3fc7a.js"
     ></script
     ><script
-      defer=""
+      async=""
       data-next-page="/"
       src="/_next/static/BUILD_ID/pages/index.js"
       crossorigin="anonymous"
       nomodule=""
     ></script
     ><script
-      defer=""
+      async=""
       data-next-page="/"
       src="/_next/static/BUILD_ID/pages/index.module.js"
       crossorigin="anonymous"
       type="module"
     ></script
     ><script
-      defer=""
+      async=""
       data-next-page="/_app"
       src="/_next/static/BUILD_ID/pages/_app.js"
       crossorigin="anonymous"
       nomodule=""
     ></script
     ><script
-      defer=""
+      async=""
       data-next-page="/_app"
       src="/_next/static/BUILD_ID/pages/_app.module.js"
       crossorigin="anonymous"
@@ -110,79 +110,79 @@
     ></script
     ><script
       src="/_next/static/runtime/webpack-4d739ac7b0d8f888ab18.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       nomodule=""
     ></script
     ><script
       src="/_next/static/runtime/webpack-d629b83a65f3e33fa99e.module.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       type="module"
     ></script
     ><script
       src="/_next/static/chunks/framework.c07ba8a3b0945b0f6315.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       nomodule=""
     ></script
     ><script
       src="/_next/static/chunks/framework.5bb7f30f859f5f31359f.module.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       type="module"
     ></script
     ><script
       src="/_next/static/chunks/commons.5d483f979b96e9afed5a.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       nomodule=""
     ></script
     ><script
       src="/_next/static/chunks/4952ddcd88e7185e66c9cf40e2d848b7e27f1574.9a0caf742c992a927903.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       nomodule=""
     ></script
     ><script
       src="/_next/static/chunks/4952ddcd88e7185e66c9cf40e2d848b7e27f1574.6406830adfd759a39616.module.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       type="module"
     ></script
     ><script
       src="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.89c4b00ceddee55473f0.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       nomodule=""
     ></script
     ><script
       src="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.496ede6c86451709e76c.module.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       type="module"
     ></script
     ><script
       src="/_next/static/runtime/main-0932201999e88ca1a7c6.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       nomodule=""
     ></script
     ><script
       src="/_next/static/runtime/main-2e0ec826639694fe2b3e.module.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       type="module"
     ></script
     ><script
       src="/_next/static/BUILD_ID/_buildManifest.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       nomodule=""
     ></script
     ><script
       src="/_next/static/BUILD_ID/_buildManifest.module.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       type="module"
     ></script>
Diff for link.html 
@@ -86,28 +86,28 @@
       src="/_next/static/runtime/polyfills-355bc4b3077ea9d3fc7a.js"
     ></script
     ><script
-      defer=""
+      async=""
       data-next-page="/link"
       src="/_next/static/BUILD_ID/pages/link.js"
       crossorigin="anonymous"
       nomodule=""
     ></script
     ><script
-      defer=""
+      async=""
       data-next-page="/link"
       src="/_next/static/BUILD_ID/pages/link.module.js"
       crossorigin="anonymous"
       type="module"
     ></script
     ><script
-      defer=""
+      async=""
       data-next-page="/_app"
       src="/_next/static/BUILD_ID/pages/_app.js"
       crossorigin="anonymous"
       nomodule=""
     ></script
     ><script
-      defer=""
+      async=""
       data-next-page="/_app"
       src="/_next/static/BUILD_ID/pages/_app.module.js"
       crossorigin="anonymous"
@@ -115,79 +115,79 @@
     ></script
     ><script
       src="/_next/static/runtime/webpack-4d739ac7b0d8f888ab18.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       nomodule=""
     ></script
     ><script
       src="/_next/static/runtime/webpack-d629b83a65f3e33fa99e.module.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       type="module"
     ></script
     ><script
       src="/_next/static/chunks/framework.c07ba8a3b0945b0f6315.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       nomodule=""
     ></script
     ><script
       src="/_next/static/chunks/framework.5bb7f30f859f5f31359f.module.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       type="module"
     ></script
     ><script
       src="/_next/static/chunks/commons.5d483f979b96e9afed5a.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       nomodule=""
     ></script
     ><script
       src="/_next/static/chunks/4952ddcd88e7185e66c9cf40e2d848b7e27f1574.9a0caf742c992a927903.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       nomodule=""
     ></script
     ><script
       src="/_next/static/chunks/4952ddcd88e7185e66c9cf40e2d848b7e27f1574.6406830adfd759a39616.module.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       type="module"
     ></script
     ><script
       src="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.89c4b00ceddee55473f0.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       nomodule=""
     ></script
     ><script
       src="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.496ede6c86451709e76c.module.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       type="module"
     ></script
     ><script
       src="/_next/static/runtime/main-0932201999e88ca1a7c6.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       nomodule=""
     ></script
     ><script
       src="/_next/static/runtime/main-2e0ec826639694fe2b3e.module.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       type="module"
     ></script
     ><script
       src="/_next/static/BUILD_ID/_buildManifest.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       nomodule=""
     ></script
     ><script
       src="/_next/static/BUILD_ID/_buildManifest.module.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       type="module"
     ></script>
Diff for withRouter.html 
@@ -81,28 +81,28 @@
       src="/_next/static/runtime/polyfills-355bc4b3077ea9d3fc7a.js"
     ></script
     ><script
-      defer=""
+      async=""
       data-next-page="/withRouter"
       src="/_next/static/BUILD_ID/pages/withRouter.js"
       crossorigin="anonymous"
       nomodule=""
     ></script
     ><script
-      defer=""
+      async=""
       data-next-page="/withRouter"
       src="/_next/static/BUILD_ID/pages/withRouter.module.js"
       crossorigin="anonymous"
       type="module"
     ></script
     ><script
-      defer=""
+      async=""
       data-next-page="/_app"
       src="/_next/static/BUILD_ID/pages/_app.js"
       crossorigin="anonymous"
       nomodule=""
     ></script
     ><script
-      defer=""
+      async=""
       data-next-page="/_app"
       src="/_next/static/BUILD_ID/pages/_app.module.js"
       crossorigin="anonymous"
@@ -110,79 +110,79 @@
     ></script
     ><script
       src="/_next/static/runtime/webpack-4d739ac7b0d8f888ab18.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       nomodule=""
     ></script
     ><script
       src="/_next/static/runtime/webpack-d629b83a65f3e33fa99e.module.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       type="module"
     ></script
     ><script
       src="/_next/static/chunks/framework.c07ba8a3b0945b0f6315.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       nomodule=""
     ></script
     ><script
       src="/_next/static/chunks/framework.5bb7f30f859f5f31359f.module.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       type="module"
     ></script
     ><script
       src="/_next/static/chunks/commons.5d483f979b96e9afed5a.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       nomodule=""
     ></script
     ><script
       src="/_next/static/chunks/4952ddcd88e7185e66c9cf40e2d848b7e27f1574.9a0caf742c992a927903.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       nomodule=""
     ></script
     ><script
       src="/_next/static/chunks/4952ddcd88e7185e66c9cf40e2d848b7e27f1574.6406830adfd759a39616.module.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       type="module"
     ></script
     ><script
       src="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.89c4b00ceddee55473f0.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       nomodule=""
     ></script
     ><script
       src="/_next/static/chunks/de003c3a9d308750aa009870a5926f9b18ab31f4.496ede6c86451709e76c.module.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       type="module"
     ></script
     ><script
       src="/_next/static/runtime/main-0932201999e88ca1a7c6.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       nomodule=""
     ></script
     ><script
       src="/_next/static/runtime/main-2e0ec826639694fe2b3e.module.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       type="module"
     ></script
     ><script
       src="/_next/static/BUILD_ID/_buildManifest.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       nomodule=""
     ></script
     ><script
       src="/_next/static/BUILD_ID/_buildManifest.module.js"
-      defer=""
+      async=""
       crossorigin="anonymous"
       type="module"
     ></script>
Serverless Mode (Decrease detected ✓)
General
zeit/next.js canary Timer/next.js hotfix/defer-async Change
buildDuration 14.5s 14.7s ⚠️ +233ms
nodeModulesSize 48.9 MB 48.9 MB ✓
Client Bundles (main, webpack, commons)
zeit/next.js canary Timer/next.js hotfix/defer-async Change
main-HASH.js gzip 5.11 kB 5.11 kB ✓
webpack-HASH.js gzip 746 B 746 B ✓
4952ddcd88e7..54d3.js gzip 4.68 kB 4.68 kB ✓
commons.HASH.js gzip 4.06 kB 4.06 kB ✓
de003c3a9d30..8249.js gzip 13.7 kB 13.7 kB ✓
framework.HASH.js gzip 39.1 kB 39.1 kB ✓
Overall change 67.5 kB 67.5 kB ✓
Client Bundles (main, webpack, commons) Modern
zeit/next.js canary Timer/next.js hotfix/defer-async Change
main-HASH.module.js gzip 4.17 kB 4.17 kB ✓
webpack-HASH..dule.js gzip 746 B 746 B ✓
4952ddcd88e7..dule.js gzip 5.56 kB 5.56 kB ✓
de003c3a9d30..dule.js gzip 12.5 kB 12.5 kB ✓
framework.HA..dule.js gzip 39.1 kB 39.1 kB ✓
Overall change 62.1 kB 62.1 kB ✓
Legacy Client Bundles (polyfills)
zeit/next.js canary Timer/next.js hotfix/defer-async Change
polyfills-HASH.js gzip 4.76 kB 4.76 kB ✓
Overall change 4.76 kB 4.76 kB ✓
Client Pages
zeit/next.js canary Timer/next.js hotfix/defer-async Change
_app.js gzip 1.33 kB 1.33 kB ✓
_error.js gzip 4.07 kB 4.07 kB ✓
hooks.js gzip 779 B 779 B ✓
index.js gzip 222 B 222 B ✓
link.js gzip 2.9 kB 2.9 kB ✓
routerDirect.js gzip 283 B 283 B ✓
withRouter.js gzip 282 B 282 B ✓
Overall change 9.87 kB 9.87 kB ✓
Client Pages Modern
zeit/next.js canary Timer/next.js hotfix/defer-async Change
_app.module.js gzip 757 B 757 B ✓
_error.module.js gzip 3.06 kB 3.06 kB ✓
hooks.module.js gzip 371 B 371 B ✓
index.module.js gzip 212 B 212 B ✓
link.module.js gzip 2.47 kB 2.47 kB ✓
routerDirect..dule.js gzip 273 B 273 B ✓
withRouter.m..dule.js gzip 272 B 272 B ✓
Overall change 7.41 kB 7.41 kB ✓
Client Build Manifests
zeit/next.js canary Timer/next.js hotfix/defer-async Change
_buildManifest.js gzip 61 B 61 B ✓
_buildManife..dule.js gzip 61 B 61 B ✓
Overall change 122 B 122 B ✓
Serverless bundles Overall decrease ✓
zeit/next.js canary Timer/next.js hotfix/defer-async Change
_error.js gzip 77.9 kB 77.9 kB -2 B
hooks.html gzip 1.05 kB 1.06 kB ⚠️ +2 B
index.js gzip 78.2 kB 78.1 kB -2 B
link.js gzip 80.6 kB 80.6 kB -2 B
routerDirect.js gzip 78.2 kB 78.2 kB -2 B
withRouter.js gzip 78.3 kB 78.3 kB -2 B
Overall change 394 kB 394 kB -8 B

Commit: 9dd708c

@ijjk ijjk merged commit 08f241f into vercel:canary Jan 17, 2020
@Timer Timer deleted the hotfix/defer-async branch January 17, 2020 18:20
@clemgrim
Copy link

clemgrim commented Jan 24, 2020 •
edited

@Timer This PR is not linked to any issue, can I ask you why did you change this? Thank you :)

@clemgrim
Copy link

@ijjk @lfades any idea?

@jhiggins-thrillist
Copy link

It looks like this hotfix breaks this experimental feature that was introduced in v9.1.2

PR: #8980

@ijjk
Copy link
Member

ijjk commented Jan 27, 2020

Hi, we changed back to async after investigation and recommendation from the Chrome team. We plan to re-introduce the experiment to switch between the two modes to enable more investigation

@Timer
Copy link
Member Author

Timer commented Jan 27, 2020

It looks like this hotfix breaks this experimental feature that was introduced in v9.1.2

PR: #8980

We'll reintroduce this in the future, but do note, experimental features may change in breaking ways, be removed, or break your application in between patch releases.

This was referenced Feb 18, 2020
Closed
Open
@jgubman
Copy link

jgubman commented Mar 17, 2020

@Timer any update on when this will be reintroduced? Like the discussion mentions:
#11120
we had a noticeable PageSpeed gain when we enabled the defer option that tanked when we upgraded from 9.1.2 -> 9.2.1 and the SEO power that be are breathing down our necks for answers...

@Siggnja
Copy link
Contributor

Siggnja commented Mar 19, 2020

@jgubman I definitely agree, would it be possible to have this as an optional setting like it was?

@jgubman
Copy link

jgubman commented Apr 30, 2020 •
edited

@ijjk @Timer any updates? See #11120 for our observations.

@vercel vercel locked as resolved and limited conversation to collaborators Jan 30, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Reviewers

@ijjk ijjk ijjk approved these changes

@lfades lfades Awaiting requested review from lfades

@timneutkens timneutkens Awaiting requested review from timneutkens timneutkens is a code owner

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
9.2.1
Development

Successfully merging this pull request may close these issues.

None yet
6 participants
@Timer @ijjk @clemgrim @jhiggins-thrillist @jgubman @Siggnja