Add page with next/image to stats-app

[ijjk]

This adds a page using next/image in the stats-app to allow us to track bundle size impacts for changes like this PR. We might want to add a page for next/script as well. This also updates the SSR pages in the stats-app to use getServerSideProps instead of getInitialProps

Bug

• Related issues linked using fixes #number
• Integration tests added
• Errors have helpful link attached, see contributing.md

Feature

• Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR.
• Related issues linked using fixes #number
• Integration tests added
• Documentation added
• Telemetry added. In case of a feature if it's used or not.
• Errors have helpful link attached, see contributing.md

Documentation / Examples

• Make sure the linting passes

[styfle]

Do we also want a couple other usages, such as blur and external image?

[ijjk]

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

[styfle]

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]

Nice work!

[ijjk]

Stats from current PR

Default Build (Increase detected ⚠️)

General

	vercel/next.js canary	ijjk/next.js add/image-stats-page	Change
buildDuration	14.5s	14.7s	⚠️ +198ms
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	⚠️ +0.01
/ avg req/sec	1057.34	1052.46	⚠️ -4.88
/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	⚠️ +170ms
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	⚠️ +0.02
/ avg req/sec	1047.08	1038.54	⚠️ -8.54
/error-in-render failed reqs	0	0	✓
/error-in-render total time (seconds)	1.323	1.337	⚠️ +0.01
/error-in-render avg req/sec	1889.38	1869.31	⚠️ -20.07

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	✓

Commit: 218f88c