Add page with next/image to stats-app #26973
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This comment has been minimized.
This comment has been minimized.
ijjk
requested review from
huozhi,
padmaia,
shuding,
styfle and
timneutkens
as code owners
styfle
reviewed
Jul 7, 2021
styfle
reviewed
Jul 7, 2021
| return ( | ||
| <> | ||
| <h1>next/image example</h1> | ||
| <Image src={logo} placeholder="blur" /> |
There was a problem hiding this comment.
Do we also want a couple other usages, such as blur and external image?
There was a problem hiding this comment.
If either of these could impact the resulting client bundle differently it would be good to add these as well yeah, potentially in separate pages so we can see the impact separately
There was a problem hiding this comment.
Hmm, I guess it won't affect the client bundle because all of the code for the image component lives in a single file.
The only thing that might affect the client bundle is config in next.config.js when that gets serialized to JSON, but thats a 1-to-1 mapping so we don't really need to test it here 👍
styfle
reviewed
Jul 7, 2021
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
Stats from current PRDefault Build (Increase detected
|
| vercel/next.js canary | ijjk/next.js add/image-stats-page | Change | |
|---|---|---|---|
| buildDuration | 14.5s | 14.7s | |
| buildDurationCached | 3.5s | 3.4s | -92ms |
| nodeModulesSize | 49.3 MB | 49.3 MB | ✓ |
Page Load Tests Overall increase ✓
| vercel/next.js canary | ijjk/next.js add/image-stats-page | Change | |
|---|---|---|---|
| / failed reqs | 0 | 0 | ✓ |
| / total time (seconds) | 2.364 | 2.375 | |
| / avg req/sec | 1057.34 | 1052.46 | |
| /error-in-render failed reqs | 0 | 0 | ✓ |
| /error-in-render total time (seconds) | 1.306 | 1.287 | -0.02 |
| /error-in-render avg req/sec | 1914.62 | 1942.32 | +27.7 |
Client Bundles (main, webpack, commons)
| vercel/next.js canary | ijjk/next.js add/image-stats-page | Change | |
|---|---|---|---|
| 359.HASH.js gzip | 3.09 kB | 3.09 kB | ✓ |
| framework-HASH.js gzip | 42 kB | 42 kB | ✓ |
| main-HASH.js gzip | 20.6 kB | 20.6 kB | ✓ |
| webpack-HASH.js gzip | 1.49 kB | 1.49 kB | ✓ |
| Overall change | 67.2 kB | 67.2 kB | ✓ |
Legacy Client Bundles (polyfills)
| vercel/next.js canary | ijjk/next.js add/image-stats-page | Change | |
|---|---|---|---|
| polyfills-HASH.js gzip | 31.1 kB | 31.1 kB | ✓ |
| Overall change | 31.1 kB | 31.1 kB | ✓ |
Client Pages
| vercel/next.js canary | ijjk/next.js add/image-stats-page | Change | |
|---|---|---|---|
| _app-HASH.js gzip | 803 B | 803 B | ✓ |
| _error-HASH.js gzip | 3.18 kB | 3.18 kB | ✓ |
| amp-HASH.js gzip | 526 B | 526 B | ✓ |
| css-HASH.js gzip | 329 B | 329 B | ✓ |
| hooks-HASH.js gzip | 903 B | 903 B | ✓ |
| image-HASH.js gzip | 5.58 kB | 5.58 kB | ✓ |
| index-HASH.js gzip | 261 B | 261 B | ✓ |
| link-HASH.js gzip | 1.66 kB | 1.66 kB | ✓ |
| routerDirect..HASH.js gzip | 319 B | 319 B | ✓ |
| withRouter-HASH.js gzip | 320 B | 320 B | ✓ |
| bb14e60e810b..30f.css gzip | 125 B | 125 B | ✓ |
| Overall change | 14 kB | 14 kB | ✓ |
Client Build Manifests
| vercel/next.js canary | ijjk/next.js add/image-stats-page | Change | |
|---|---|---|---|
| _buildManifest.js gzip | 418 B | 418 B | ✓ |
| Overall change | 418 B | 418 B | ✓ |
Rendered Page Sizes
| vercel/next.js canary | ijjk/next.js add/image-stats-page | Change | |
|---|---|---|---|
| index.html gzip | 531 B | 531 B | ✓ |
| link.html gzip | 544 B | 544 B | ✓ |
| withRouter.html gzip | 524 B | 524 B | ✓ |
| Overall change | 1.6 kB | 1.6 kB | ✓ |
Webpack 4 Mode (Decrease detected ✓)
General
| vercel/next.js canary | ijjk/next.js add/image-stats-page | Change | |
|---|---|---|---|
| buildDuration | 11.6s | 11.8s | |
| buildDurationCached | 4.7s | 4.7s | -66ms |
| nodeModulesSize | 49.3 MB | 49.3 MB | ✓ |
Page Load Tests Overall decrease ⚠️
| vercel/next.js canary | ijjk/next.js add/image-stats-page | Change | |
|---|---|---|---|
| / failed reqs | 0 | 0 | ✓ |
| / total time (seconds) | 2.388 | 2.407 | |
| / avg req/sec | 1047.08 | 1038.54 | |
| /error-in-render failed reqs | 0 | 0 | ✓ |
| /error-in-render total time (seconds) | 1.323 | 1.337 | |
| /error-in-render avg req/sec | 1889.38 | 1869.31 |
Client Bundles (main, webpack, commons)
| vercel/next.js canary | ijjk/next.js add/image-stats-page | Change | |
|---|---|---|---|
| 14.HASH.js gzip | 3.11 kB | 3.11 kB | ✓ |
| 677f882d2ed8..HASH.js gzip | 13.9 kB | 13.9 kB | ✓ |
| framework.HASH.js gzip | 41.8 kB | 41.8 kB | ✓ |
| main-HASH.js gzip | 7.81 kB | 7.81 kB | ✓ |
| webpack-HASH.js gzip | 1.19 kB | 1.19 kB | ✓ |
| Overall change | 67.8 kB | 67.8 kB | ✓ |
Legacy Client Bundles (polyfills)
| vercel/next.js canary | ijjk/next.js add/image-stats-page | Change | |
|---|---|---|---|
| polyfills-HASH.js gzip | 31.3 kB | 31.3 kB | ✓ |
| Overall change | 31.3 kB | 31.3 kB | ✓ |
Client Pages
| vercel/next.js canary | ijjk/next.js add/image-stats-page | Change | |
|---|---|---|---|
| _app-HASH.js gzip | 791 B | 791 B | ✓ |
| _error-HASH.js gzip | 3.83 kB | 3.83 kB | ✓ |
| amp-HASH.js gzip | 531 B | 531 B | ✓ |
| css-HASH.js gzip | 333 B | 333 B | ✓ |
| hooks-HASH.js gzip | 910 B | 910 B | ✓ |
| index-HASH.js gzip | 230 B | 230 B | ✓ |
| link-HASH.js gzip | 1.64 kB | 1.64 kB | ✓ |
| routerDirect..HASH.js gzip | 297 B | 297 B | ✓ |
| withRouter-HASH.js gzip | 293 B | 293 B | ✓ |
| e025d2764813..52f.css gzip | 125 B | 125 B | ✓ |
| Overall change | 8.98 kB | 8.98 kB | ✓ |
Client Build Manifests
| vercel/next.js canary | ijjk/next.js add/image-stats-page | Change | |
|---|---|---|---|
| _buildManifest.js gzip | 418 B | 418 B | ✓ |
| Overall change | 418 B | 418 B | ✓ |
Rendered Page Sizes
| vercel/next.js canary | ijjk/next.js add/image-stats-page | Change | |
|---|---|---|---|
| index.html gzip | 575 B | 575 B | ✓ |
| link.html gzip | 586 B | 586 B | ✓ |
| withRouter.html gzip | 568 B | 568 B | ✓ |
| Overall change | 1.73 kB | 1.73 kB | ✓ |
flybayer
pushed a commit
to blitz-js/next.js
that referenced
this pull request
Aug 19, 2021
* Add page with next/image to stats-app * Update stats-config * Update globs * Only run prettier on js outputs * only add image page for non-webpack 4 mode * update config * Re-add moving page chunks
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
This adds a page using
next/imagein thestats-appto allow us to track bundle size impacts for changes like this PR. We might want to add a page fornext/scriptas well. This also updates the SSR pages in thestats-appto usegetServerSidePropsinstead ofgetInitialPropsBug
fixes #numbercontributing.mdFeature
fixes #numbercontributing.mdDocumentation / Examples