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

Introduce react profiling production flag #13873

Merged
merged 5 commits into from
Jun 28, 2020
Merged

Introduce react profiling production flag #13873

merged 5 commits into from
Jun 28, 2020

Conversation

todortotev
Copy link
Contributor

Closes 13709.

The solution works, (tested and confirmed with true and false flags with the latest next version) though I am quite sure this is not the most elegant and proper way to implement it. I have spent the good part of yesterday and today's morning in order to make it more generic but since it's my first time working with anything related to webpack I have struggled miserably. Last, but not least I'm unsure if this is the most proper naming for the flag.

Please, let me know what you want me to change and I'll get it done asap.

@ijjk ijjk added the type: next label Jun 7, 2020
@ijjk
Copy link
Member

ijjk commented Jun 7, 2020

Stats from current PR

Default Server Mode (Increase detected ⚠️)
General Overall increase ⚠️
vercel/next.js canary TodorTotev/next.js profiling-tag-production Change
buildDuration 10.5s 11.6s ⚠️ +1.1s
nodeModulesSize 66 MB 66 MB ⚠️ +944 B
Page Load Tests Overall increase ✓
vercel/next.js canary TodorTotev/next.js profiling-tag-production Change
/ failed reqs 0 0 ✓
/ total time (seconds) 1.824 1.784 -0.04
/ avg req/sec 1370.86 1401.56 ⚠️ +30.7
/error-in-render failed reqs 0 0 ✓
/error-in-render total time (seconds) 1.052 1.014 -0.04
/error-in-render avg req/sec 2375.35 2466.54 ⚠️ +91.19
Client Bundles (main, webpack, commons)
vercel/next.js canary TodorTotev/next.js profiling-tag-production Change
main-HASH.js gzip 6.61 kB 6.61 kB ✓
webpack-HASH.js gzip 746 B 746 B ✓
de003c3a9d30..9545.js gzip 10.5 kB 10.5 kB ✓
framework.HASH.js gzip 39.1 kB 39.1 kB ✓
Overall change 57 kB 57 kB ✓
Client Bundles (main, webpack, commons) Modern
vercel/next.js canary TodorTotev/next.js profiling-tag-production Change
main-HASH.module.js gzip 5.69 kB 5.69 kB ✓
webpack-HASH..dule.js gzip 746 B 746 B ✓
de003c3a9d30..dule.js gzip 6.92 kB 6.92 kB ✓
framework.HA..dule.js gzip 39.1 kB 39.1 kB ✓
Overall change 52.5 kB 52.5 kB ✓
Legacy Client Bundles (polyfills)
vercel/next.js canary TodorTotev/next.js profiling-tag-production Change
polyfills-HASH.js gzip 26.3 kB 26.3 kB ✓
Overall change 26.3 kB 26.3 kB ✓
Client Pages
vercel/next.js canary TodorTotev/next.js profiling-tag-production Change
_app.js gzip 1.26 kB 1.26 kB ✓
_error.js gzip 3.25 kB 3.25 kB ✓
hooks.js gzip 881 B 881 B ✓
index.js gzip 222 B 222 B ✓
link.js gzip 2.05 kB 2.05 kB ✓
routerDirect.js gzip 279 B 279 B ✓
withRouter.js gzip 278 B 278 B ✓
Overall change 8.21 kB 8.21 kB ✓
Client Pages Modern
vercel/next.js canary TodorTotev/next.js profiling-tag-production Change
_app.module.js gzip 604 B 604 B ✓
_error.module.js gzip 2.04 kB 2.04 kB ✓
hooks.module.js gzip 383 B 383 B ✓
index.module.js gzip 223 B 223 B ✓
link.module.js gzip 1.51 kB 1.51 kB ✓
routerDirect..dule.js gzip 281 B 281 B ✓
withRouter.m..dule.js gzip 278 B 278 B ✓
Overall change 5.32 kB 5.32 kB ✓
Client Build Manifests
vercel/next.js canary TodorTotev/next.js profiling-tag-production 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
vercel/next.js canary TodorTotev/next.js profiling-tag-production Change
index.html gzip 926 B 926 B ✓
link.html gzip 936 B 936 B ✓
withRouter.html gzip 923 B 923 B ✓
Overall change 2.79 kB 2.79 kB ✓
Serverless Mode
General Overall increase ⚠️
vercel/next.js canary TodorTotev/next.js profiling-tag-production Change
buildDuration 11.6s 11.6s ⚠️ +37ms
nodeModulesSize 66 MB 66 MB ⚠️ +944 B
Client Bundles (main, webpack, commons)
vercel/next.js canary TodorTotev/next.js profiling-tag-production Change
main-HASH.js gzip 6.61 kB 6.61 kB ✓
webpack-HASH.js gzip 746 B 746 B ✓
de003c3a9d30..9545.js gzip 10.5 kB 10.5 kB ✓
framework.HASH.js gzip 39.1 kB 39.1 kB ✓
Overall change 57 kB 57 kB ✓
Client Bundles (main, webpack, commons) Modern
vercel/next.js canary TodorTotev/next.js profiling-tag-production Change
main-HASH.module.js gzip 5.69 kB 5.69 kB ✓
webpack-HASH..dule.js gzip 746 B 746 B ✓
de003c3a9d30..dule.js gzip 6.92 kB 6.92 kB ✓
framework.HA..dule.js gzip 39.1 kB 39.1 kB ✓
Overall change 52.5 kB 52.5 kB ✓
Legacy Client Bundles (polyfills)
vercel/next.js canary TodorTotev/next.js profiling-tag-production Change
polyfills-HASH.js gzip 26.3 kB 26.3 kB ✓
Overall change 26.3 kB 26.3 kB ✓
Client Pages
vercel/next.js canary TodorTotev/next.js profiling-tag-production Change
_app.js gzip 1.26 kB 1.26 kB ✓
_error.js gzip 3.25 kB 3.25 kB ✓
hooks.js gzip 881 B 881 B ✓
index.js gzip 222 B 222 B ✓
link.js gzip 2.05 kB 2.05 kB ✓
routerDirect.js gzip 279 B 279 B ✓
withRouter.js gzip 278 B 278 B ✓
Overall change 8.21 kB 8.21 kB ✓
Client Pages Modern
vercel/next.js canary TodorTotev/next.js profiling-tag-production Change
_app.module.js gzip 604 B 604 B ✓
_error.module.js gzip 2.04 kB 2.04 kB ✓
hooks.module.js gzip 383 B 383 B ✓
index.module.js gzip 223 B 223 B ✓
link.module.js gzip 1.51 kB 1.51 kB ✓
routerDirect..dule.js gzip 281 B 281 B ✓
withRouter.m..dule.js gzip 278 B 278 B ✓
Overall change 5.32 kB 5.32 kB ✓
Client Build Manifests
vercel/next.js canary TodorTotev/next.js profiling-tag-production Change
_buildManifest.js gzip 61 B 61 B ✓
_buildManife..dule.js gzip 61 B 61 B ✓
Overall change 122 B 122 B ✓
Serverless bundles
vercel/next.js canary TodorTotev/next.js profiling-tag-production Change
_error.js 877 kB 877 kB ✓
404.html 4.18 kB 4.18 kB ✓
hooks.html 3.81 kB 3.81 kB ✓
index.js 877 kB 877 kB ✓
link.js 915 kB 915 kB ✓
routerDirect.js 907 kB 907 kB ✓
withRouter.js 907 kB 907 kB ✓
Overall change 4.49 MB 4.49 MB ✓

timneutkens
timneutkens requested changes Jun 15, 2020
View reviewed changes
Copy link
Member

@timneutkens timneutkens left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This PR needs tests

@ijjk
Copy link
Member

ijjk commented Jun 15, 2020

Stats from current PR

Default Server Mode (Decrease detected ✓)
General Overall increase ⚠️
vercel/next.js canary todortotev/next.js profiling-tag-production Change
buildDuration 11.2s 11.1s -138ms
nodeModulesSize 65.2 MB 65.2 MB ⚠️ +827 B
Page Load Tests Overall decrease ⚠️
vercel/next.js canary todortotev/next.js profiling-tag-production Change
/ failed reqs 0 0 ✓
/ total time (seconds) 2.06 2.03 -0.03
/ avg req/sec 1213.5 1231.44 ⚠️ +17.94
/error-in-render failed reqs 0 0 ✓
/error-in-render total time (seconds) 1.294 1.354 ⚠️ +0.06
/error-in-render avg req/sec 1932.27 1845.73 -86.54
Client Bundles (main, webpack, commons)
vercel/next.js canary todortotev/next.js profiling-tag-production Change
main-HASH.js gzip 6.51 kB 6.51 kB ✓
webpack-HASH.js gzip 746 B 746 B ✓
de003c3a9d30..0538.js gzip 10.5 kB 10.5 kB ✓
framework.HASH.js gzip 39.1 kB 39.1 kB ✓
Overall change 56.9 kB 56.9 kB ✓
Client Bundles (main, webpack, commons) Modern
vercel/next.js canary todortotev/next.js profiling-tag-production Change
main-HASH.module.js gzip 5.6 kB 5.6 kB ✓
webpack-HASH..dule.js gzip 746 B 746 B ✓
de003c3a9d30..dule.js gzip 6.93 kB 6.93 kB ✓
framework.HA..dule.js gzip 39.1 kB 39.1 kB ✓
Overall change 52.4 kB 52.4 kB ✓
Legacy Client Bundles (polyfills)
vercel/next.js canary todortotev/next.js profiling-tag-production Change
polyfills-HASH.js gzip 26.3 kB 26.3 kB ✓
Overall change 26.3 kB 26.3 kB ✓
Client Pages
vercel/next.js canary todortotev/next.js profiling-tag-production Change
routerDirect.js gzip 279 B 279 B ✓
withRouter.js gzip 278 B 278 B ✓
_error.js gzip 3.37 kB 3.37 kB ✓
index.js gzip 222 B 222 B ✓
link.js gzip 2.05 kB 2.05 kB ✓
hooks.js gzip 881 B 881 B ✓
_app.js gzip 1.26 kB 1.26 kB ✓
Overall change 8.34 kB 8.34 kB ✓
Client Pages Modern
vercel/next.js canary todortotev/next.js profiling-tag-production Change
index.module.js gzip 223 B 223 B ✓
routerDirect..dule.js gzip 281 B 281 B ✓
withRouter.m..dule.js gzip 278 B 278 B ✓
hooks.module.js gzip 383 B 383 B ✓
_error.module.js gzip 2.21 kB 2.21 kB ✓
link.module.js gzip 1.52 kB 1.52 kB ✓
_app.module.js gzip 604 B 604 B ✓
Overall change 5.49 kB 5.49 kB ✓
Client Build Manifests
vercel/next.js canary todortotev/next.js profiling-tag-production Change
_buildManifest.js gzip 270 B 270 B ✓
_buildManife..dule.js gzip 274 B 274 B ✓
Overall change 544 B 544 B ✓
Rendered Page Sizes
vercel/next.js canary todortotev/next.js profiling-tag-production Change
index.html gzip 956 B 956 B ✓
link.html gzip 963 B 963 B ✓
withRouter.html gzip 949 B 949 B ✓
Overall change 2.87 kB 2.87 kB ✓
Serverless Mode
General Overall increase ⚠️
vercel/next.js canary todortotev/next.js profiling-tag-production Change
buildDuration 12.1s 12.4s ⚠️ +334ms
nodeModulesSize 65.2 MB 65.2 MB ⚠️ +827 B
Client Bundles (main, webpack, commons)
vercel/next.js canary todortotev/next.js profiling-tag-production Change
main-HASH.js gzip 6.51 kB 6.51 kB ✓
webpack-HASH.js gzip 746 B 746 B ✓
de003c3a9d30..0538.js gzip 10.5 kB 10.5 kB ✓
framework.HASH.js gzip 39.1 kB 39.1 kB ✓
Overall change 56.9 kB 56.9 kB ✓
Client Bundles (main, webpack, commons) Modern
vercel/next.js canary todortotev/next.js profiling-tag-production Change
main-HASH.module.js gzip 5.6 kB 5.6 kB ✓
webpack-HASH..dule.js gzip 746 B 746 B ✓
de003c3a9d30..dule.js gzip 6.93 kB 6.93 kB ✓
framework.HA..dule.js gzip 39.1 kB 39.1 kB ✓
Overall change 52.4 kB 52.4 kB ✓
Legacy Client Bundles (polyfills)
vercel/next.js canary todortotev/next.js profiling-tag-production Change
polyfills-HASH.js gzip 26.3 kB 26.3 kB ✓
Overall change 26.3 kB 26.3 kB ✓
Client Pages
vercel/next.js canary todortotev/next.js profiling-tag-production Change
routerDirect.js gzip 279 B 279 B ✓
withRouter.js gzip 278 B 278 B ✓
_error.js gzip 3.37 kB 3.37 kB ✓
index.js gzip 222 B 222 B ✓
link.js gzip 2.05 kB 2.05 kB ✓
hooks.js gzip 881 B 881 B ✓
_app.js gzip 1.26 kB 1.26 kB ✓
Overall change 8.34 kB 8.34 kB ✓
Client Pages Modern
vercel/next.js canary todortotev/next.js profiling-tag-production Change
index.module.js gzip 223 B 223 B ✓
routerDirect..dule.js gzip 281 B 281 B ✓
withRouter.m..dule.js gzip 278 B 278 B ✓
hooks.module.js gzip 383 B 383 B ✓
_error.module.js gzip 2.21 kB 2.21 kB ✓
link.module.js gzip 1.52 kB 1.52 kB ✓
_app.module.js gzip 604 B 604 B ✓
Overall change 5.49 kB 5.49 kB ✓
Client Build Manifests
vercel/next.js canary todortotev/next.js profiling-tag-production Change
_buildManifest.js gzip 270 B 270 B ✓
_buildManife..dule.js gzip 274 B 274 B ✓
Overall change 544 B 544 B ✓
Serverless bundles
vercel/next.js canary todortotev/next.js profiling-tag-production Change
_error.js 875 kB 875 kB ✓
404.html 4.17 kB 4.17 kB ✓
hooks.html 3.79 kB 3.79 kB ✓
index.js 875 kB 875 kB ✓
link.js 913 kB 913 kB ✓
routerDirect.js 906 kB 906 kB ✓
withRouter.js 906 kB 906 kB ✓
Overall change 4.48 MB 4.48 MB ✓

@todortotev
Copy link
Contributor Author

This PR needs tests

@timneutkens Just saw your message. Getting it done!

ijjk
ijjk approved these changes Jun 27, 2020
View reviewed changes
Copy link
Member

@ijjk ijjk left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM, went ahead and added tests so we can land this. Thanks for the PR!

@ijjk ijjk requested a review from timneutkens June 27, 2020 19:15
@ijjk
Copy link
Member

ijjk commented Jun 27, 2020

Stats from current PR

Default Server Mode (Decrease detected ✓)
General Overall increase ⚠️
vercel/next.js canary todortotev/next.js profiling-tag-production Change
buildDuration 11.7s 11.9s ⚠️ +252ms
nodeModulesSize 67.1 MB 67.1 MB ⚠️ +817 B
Page Load Tests Overall decrease ⚠️
vercel/next.js canary todortotev/next.js profiling-tag-production Change
/ failed reqs 0 0 ✓
/ total time (seconds) 2.218 2.153 -0.06
/ avg req/sec 1127.15 1160.98 ⚠️ +33.83
/error-in-render failed reqs 0 0 ✓
/error-in-render total time (seconds) 1.425 1.54 ⚠️ +0.12
/error-in-render avg req/sec 1754.71 1623.3 -131.41
Client Bundles (main, webpack, commons)
vercel/next.js canary todortotev/next.js profiling-tag-production Change
main-HASH.js gzip 6.51 kB 6.51 kB ✓
webpack-HASH.js gzip 751 B 751 B ✓
19b7e98f51cc..558d.js gzip 10.7 kB 10.7 kB ✓
framework.HASH.js gzip 39.1 kB 39.1 kB ✓
Overall change 57.1 kB 57.1 kB ✓
Client Bundles (main, webpack, commons) Modern
vercel/next.js canary todortotev/next.js profiling-tag-production Change
main-HASH.module.js gzip 5.59 kB 5.59 kB ✓
webpack-HASH..dule.js gzip 751 B 751 B ✓
19b7e98f51cc..dule.js gzip 7.08 kB 7.08 kB ✓
framework.HA..dule.js gzip 39.1 kB 39.1 kB ✓
Overall change 52.6 kB 52.6 kB ✓
Legacy Client Bundles (polyfills)
vercel/next.js canary todortotev/next.js profiling-tag-production Change
polyfills-HASH.js gzip 26.3 kB 26.3 kB ✓
Overall change 26.3 kB 26.3 kB ✓
Client Build Manifests
vercel/next.js canary todortotev/next.js profiling-tag-production Change
_buildManifest.js gzip 268 B 268 B ✓
_buildManife..dule.js gzip 272 B 272 B ✓
Overall change 540 B 540 B ✓
Rendered Page Sizes
vercel/next.js canary todortotev/next.js profiling-tag-production Change
index.html gzip 954 B 954 B ✓
link.html gzip 959 B 959 B ✓
withRouter.html gzip 947 B 947 B ✓
Overall change 2.86 kB 2.86 kB ✓
Serverless Mode
General Overall increase ⚠️
vercel/next.js canary todortotev/next.js profiling-tag-production Change
buildDuration 12.8s 12.9s ⚠️ +71ms
nodeModulesSize 67.1 MB 67.1 MB ⚠️ +817 B
Client Bundles (main, webpack, commons)
vercel/next.js canary todortotev/next.js profiling-tag-production Change
main-HASH.js gzip 6.51 kB 6.51 kB ✓
webpack-HASH.js gzip 751 B 751 B ✓
19b7e98f51cc..558d.js gzip 10.7 kB 10.7 kB ✓
framework.HASH.js gzip 39.1 kB 39.1 kB ✓
Overall change 57.1 kB 57.1 kB ✓
Client Bundles (main, webpack, commons) Modern
vercel/next.js canary todortotev/next.js profiling-tag-production Change
main-HASH.module.js gzip 5.59 kB 5.59 kB ✓
webpack-HASH..dule.js gzip 751 B 751 B ✓
19b7e98f51cc..dule.js gzip 7.08 kB 7.08 kB ✓
framework.HA..dule.js gzip 39.1 kB 39.1 kB ✓
Overall change 52.6 kB 52.6 kB ✓
Legacy Client Bundles (polyfills)
vercel/next.js canary todortotev/next.js profiling-tag-production Change
polyfills-HASH.js gzip 26.3 kB 26.3 kB ✓
Overall change 26.3 kB 26.3 kB ✓
Client Build Manifests
vercel/next.js canary todortotev/next.js profiling-tag-production Change
_buildManifest.js gzip 268 B 268 B ✓
_buildManife..dule.js gzip 272 B 272 B ✓
Overall change 540 B 540 B ✓
Serverless bundles
vercel/next.js canary todortotev/next.js profiling-tag-production Change
_error.js 875 kB 875 kB ✓
404.html 4.17 kB 4.17 kB ✓
hooks.html 3.79 kB 3.79 kB ✓
index.js 876 kB 876 kB ✓
link.js 916 kB 916 kB ✓
routerDirect.js 908 kB 908 kB ✓
withRouter.js 908 kB 908 kB ✓
Overall change 4.49 MB 4.49 MB ✓
Commit: b433295

@kodiakhq kodiakhq bot merged commit 1aed9ea into vercel:canary Jun 28, 2020
rokinsky pushed a commit to rokinsky/next.js that referenced this pull request Jul 11, 2020
@todortotev @rokinsky
Introduce react profiling production flag (vercel#13873)
7fe8fc3 
Closes [13709](vercel#13709).

The solution works, **(tested and confirmed with true and false flags with the latest next version)** though I am quite sure this is not the most elegant and proper way to implement it. I have spent the good part of yesterday and today's morning in order to make it more generic but since it's my first time working with anything related to webpack I have struggled miserably. Last, but not least I'm unsure if this is the most proper naming for the flag.

Please, let me know what you want me to change and I'll get it done asap.
@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

@timneutkens timneutkens timneutkens approved these changes

@lfades lfades Awaiting requested review from lfades

@Timer Timer Awaiting requested review from Timer

Assignees
No one assigned
Labels
type: next
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

Allow React Profiling in production through reactProductionProfiling: true in next.config.js
3 participants
@todortotev @ijjk @timneutkens