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

Refactor with redux saga #13342

Merged
merged 9 commits into from
May 25, 2020
Merged

Refactor with redux saga #13342

merged 9 commits into from
May 25, 2020

Conversation

todortotev
Copy link
Contributor

Related to 11014

Upgraded all the packages from package.json, removed the saga-wrapper package since it is totally outdated to today's use.

I have refactored the whole example using the new API of the next-redux-wrapper package, using their new support of "getStaticProps".

All of the class components were converted to functional, using the new redux hooks API.

If you want me to change anything or you are not satisfied with any given change, I'm open to suggestions.

@todortotev todortotev requested review from lfades and Timer as code owners May 25, 2020 11:46
@ijjk
Copy link
Member

ijjk commented May 25, 2020

Stats from current PR

Default Server Mode (Increase detected ⚠️)
General
zeit/next.js canary TodorTotev/next.js refactor-with-redux-saga Change
buildDuration 12.1s 12.1s ⚠️ +19ms
nodeModulesSize 61.8 MB 61.8 MB ✓
Page Load Tests Overall increase ✓
zeit/next.js canary TodorTotev/next.js refactor-with-redux-saga Change
/ failed reqs 0 0 ✓
/ total time (seconds) 2.198 2.269 ⚠️ +0.07
/ avg req/sec 1137.51 1101.67 -35.84
/error-in-render failed reqs 0 0 ✓
/error-in-render total time (seconds) 1.367 1.313 -0.05
/error-in-render avg req/sec 1829.17 1904.31 ⚠️ +75.14
Client Bundles (main, webpack, commons)
zeit/next.js canary TodorTotev/next.js refactor-with-redux-saga Change
main-HASH.js gzip 6.59 kB 6.59 kB ✓
webpack-HASH.js gzip 746 B 746 B ✓
de003c3a9d30..1e23.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
zeit/next.js canary TodorTotev/next.js refactor-with-redux-saga Change
main-HASH.module.js gzip 5.67 kB 5.67 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)
zeit/next.js canary TodorTotev/next.js refactor-with-redux-saga Change
polyfills-HASH.js gzip 26.3 kB 26.3 kB ✓
Overall change 26.3 kB 26.3 kB ✓
Client Pages
zeit/next.js canary TodorTotev/next.js refactor-with-redux-saga 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.06 kB 2.06 kB ✓
routerDirect.js gzip 279 B 279 B ✓
withRouter.js gzip 278 B 278 B ✓
Overall change 8.22 kB 8.22 kB ✓
Client Pages Modern
zeit/next.js canary TodorTotev/next.js refactor-with-redux-saga 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.52 kB 1.52 kB ✓
routerDirect..dule.js gzip 281 B 281 B ✓
withRouter.m..dule.js gzip 278 B 278 B ✓
Overall change 5.33 kB 5.33 kB ✓
Client Build Manifests
zeit/next.js canary TodorTotev/next.js refactor-with-redux-saga 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
zeit/next.js canary TodorTotev/next.js refactor-with-redux-saga Change
index.html gzip 927 B 927 B ✓
link.html gzip 937 B 937 B ✓
withRouter.html gzip 924 B 924 B ✓
Overall change 2.79 kB 2.79 kB ✓
Serverless Mode
General
zeit/next.js canary TodorTotev/next.js refactor-with-redux-saga Change
buildDuration 12.4s 12.4s -16ms
nodeModulesSize 61.8 MB 61.8 MB ✓
Client Bundles (main, webpack, commons)
zeit/next.js canary TodorTotev/next.js refactor-with-redux-saga Change
main-HASH.js gzip 6.59 kB 6.59 kB ✓
webpack-HASH.js gzip 746 B 746 B ✓
de003c3a9d30..1e23.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
zeit/next.js canary TodorTotev/next.js refactor-with-redux-saga Change
main-HASH.module.js gzip 5.67 kB 5.67 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)
zeit/next.js canary TodorTotev/next.js refactor-with-redux-saga Change
polyfills-HASH.js gzip 26.3 kB 26.3 kB ✓
Overall change 26.3 kB 26.3 kB ✓
Client Pages
zeit/next.js canary TodorTotev/next.js refactor-with-redux-saga 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.06 kB 2.06 kB ✓
routerDirect.js gzip 279 B 279 B ✓
withRouter.js gzip 278 B 278 B ✓
Overall change 8.22 kB 8.22 kB ✓
Client Pages Modern
zeit/next.js canary TodorTotev/next.js refactor-with-redux-saga 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.52 kB 1.52 kB ✓
routerDirect..dule.js gzip 281 B 281 B ✓
withRouter.m..dule.js gzip 278 B 278 B ✓
Overall change 5.33 kB 5.33 kB ✓
Client Build Manifests
zeit/next.js canary TodorTotev/next.js refactor-with-redux-saga Change
_buildManifest.js gzip 61 B 61 B ✓
_buildManife..dule.js gzip 61 B 61 B ✓
Overall change 122 B 122 B ✓
Serverless bundles
zeit/next.js canary TodorTotev/next.js refactor-with-redux-saga Change
_error.js 844 kB 844 kB ✓
404.html 4.18 kB 4.18 kB ✓
hooks.html 3.81 kB 3.81 kB ✓
index.js 844 kB 844 kB ✓
link.js 882 kB 882 kB ✓
routerDirect.js 874 kB 874 kB ✓
withRouter.js 874 kB 874 kB ✓
Overall change 4.33 MB 4.33 MB ✓

@Timer Timer added the examples Issue was opened via the examples template. label May 25, 2020
@Timer Timer added this to the 9.4.3 milestone May 25, 2020
Timer
Timer approved these changes May 25, 2020
View reviewed changes
Copy link
Member

@Timer Timer left a comment

Choose a reason for hiding this comment

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

Looks great to me, thank you so much!

@ijjk
Copy link
Member

ijjk commented May 25, 2020

Stats from current PR

Default Server Mode (Decrease detected ✓)
General
zeit/next.js canary TodorTotev/next.js refactor-with-redux-saga Change
buildDuration 13.9s 14.3s ⚠️ +348ms
nodeModulesSize 66.4 MB 66.4 MB ✓
Page Load Tests Overall decrease ⚠️
zeit/next.js canary TodorTotev/next.js refactor-with-redux-saga Change
/ failed reqs 0 0 ✓
/ total time (seconds) 2.396 2.539 ⚠️ +0.14
/ avg req/sec 1043.41 984.48 -58.93
/error-in-render failed reqs 0 0 ✓
/error-in-render total time (seconds) 1.529 1.542 ⚠️ +0.01
/error-in-render avg req/sec 1635.28 1621.06 -14.22
Client Bundles (main, webpack, commons)
zeit/next.js canary TodorTotev/next.js refactor-with-redux-saga Change
main-HASH.js gzip 6.59 kB 6.59 kB ✓
webpack-HASH.js gzip 746 B 746 B ✓
de003c3a9d30..1e23.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
zeit/next.js canary TodorTotev/next.js refactor-with-redux-saga Change
main-HASH.module.js gzip 5.67 kB 5.67 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)
zeit/next.js canary TodorTotev/next.js refactor-with-redux-saga Change
polyfills-HASH.js gzip 26.3 kB 26.3 kB ✓
Overall change 26.3 kB 26.3 kB ✓
Client Pages
zeit/next.js canary TodorTotev/next.js refactor-with-redux-saga 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.06 kB 2.06 kB ✓
routerDirect.js gzip 279 B 279 B ✓
withRouter.js gzip 278 B 278 B ✓
Overall change 8.22 kB 8.22 kB ✓
Client Pages Modern
zeit/next.js canary TodorTotev/next.js refactor-with-redux-saga 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.52 kB 1.52 kB ✓
routerDirect..dule.js gzip 281 B 281 B ✓
withRouter.m..dule.js gzip 278 B 278 B ✓
Overall change 5.33 kB 5.33 kB ✓
Client Build Manifests
zeit/next.js canary TodorTotev/next.js refactor-with-redux-saga 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
zeit/next.js canary TodorTotev/next.js refactor-with-redux-saga Change
index.html gzip 927 B 927 B ✓
link.html gzip 937 B 937 B ✓
withRouter.html gzip 924 B 924 B ✓
Overall change 2.79 kB 2.79 kB ✓
Serverless Mode
General
zeit/next.js canary TodorTotev/next.js refactor-with-redux-saga Change
buildDuration 14.9s 14.6s -340ms
nodeModulesSize 66.4 MB 66.4 MB ✓
Client Bundles (main, webpack, commons)
zeit/next.js canary TodorTotev/next.js refactor-with-redux-saga Change
main-HASH.js gzip 6.59 kB 6.59 kB ✓
webpack-HASH.js gzip 746 B 746 B ✓
de003c3a9d30..1e23.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
zeit/next.js canary TodorTotev/next.js refactor-with-redux-saga Change
main-HASH.module.js gzip 5.67 kB 5.67 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)
zeit/next.js canary TodorTotev/next.js refactor-with-redux-saga Change
polyfills-HASH.js gzip 26.3 kB 26.3 kB ✓
Overall change 26.3 kB 26.3 kB ✓
Client Pages
zeit/next.js canary TodorTotev/next.js refactor-with-redux-saga 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.06 kB 2.06 kB ✓
routerDirect.js gzip 279 B 279 B ✓
withRouter.js gzip 278 B 278 B ✓
Overall change 8.22 kB 8.22 kB ✓
Client Pages Modern
zeit/next.js canary TodorTotev/next.js refactor-with-redux-saga 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.52 kB 1.52 kB ✓
routerDirect..dule.js gzip 281 B 281 B ✓
withRouter.m..dule.js gzip 278 B 278 B ✓
Overall change 5.33 kB 5.33 kB ✓
Client Build Manifests
zeit/next.js canary TodorTotev/next.js refactor-with-redux-saga Change
_buildManifest.js gzip 61 B 61 B ✓
_buildManife..dule.js gzip 61 B 61 B ✓
Overall change 122 B 122 B ✓
Serverless bundles
zeit/next.js canary TodorTotev/next.js refactor-with-redux-saga Change
_error.js 844 kB 844 kB ✓
404.html 4.18 kB 4.18 kB ✓
hooks.html 3.81 kB 3.81 kB ✓
index.js 844 kB 844 kB ✓
link.js 882 kB 882 kB ✓
routerDirect.js 874 kB 874 kB ✓
withRouter.js 874 kB 874 kB ✓
Overall change 4.33 MB 4.33 MB ✓

@kodiakhq kodiakhq bot merged commit cc4b0c7 into vercel:canary May 25, 2020
@edshav
Copy link

edshav commented Jun 2, 2020 •
edited
Loading

@todortotev Thank you for your work.
Could you add the getServerSideProps function to this example? If I just replace getStaticProps with getServerSideProps, then my code does not work - placeholderData is not loaded.

rokinsky pushed a commit to rokinsky/next.js that referenced this pull request Jul 11, 2020
@todortotev @rokinsky
Refactor with redux saga (vercel#13342)
8454438 
Related to [11014](vercel#11014)

Upgraded all the packages from package.json, removed the saga-wrapper package since it is totally outdated to today's use.

I have refactored the whole example using the new API of the next-redux-wrapper package, using their new support of "getStaticProps".

All of the class components were converted to functional, using the new redux hooks API.

If you want me to change anything or you are not satisfied with any given change, I'm open to suggestions.
@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

@Timer Timer Timer approved these changes

@lfades lfades Awaiting requested review from lfades

Assignees
No one assigned
Labels
examples Issue was opened via the examples template.
Projects
None yet
Milestone
9.4.3
Development

Successfully merging this pull request may close these issues.
4 participants
@todortotev @ijjk @edshav @Timer