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.

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

Bundle optimization #227

Closed
sxlwar opened this issue Sep 2, 2022 · 8 comments
Closed

Bundle optimization #227

sxlwar opened this issue Sep 2, 2022 · 8 comments

Comments

@sxlwar
Copy link
Contributor

sxlwar commented Sep 2, 2022

Topic

Code

Description

helix

~/projects/itering/helix-ui/ [bundle_optimize] yarn build:helix
yarn run v1.22.17
$ node_modules/.bin/lerna run --scope helix --stream build
lerna notice cli v4.0.0
lerna notice filter including "helix"
lerna info filter [ 'helix' ]
lerna info Executing command in 1 package: "yarn run build"
helix: $ next build
helix: info  - Loaded env from /Users/shaoxuelei/projects/itering/helix-ui/packages/helix/.env.production
helix: warn  - You have enabled experimental feature(s).
helix: warn  - Experimental features are not covered by semver, and may cause unexpected or broken application behavior. Use them at your own risk.
helix: info  - Checking validity of types...
helix: warn  - The Next.js plugin was not detected in your ESLint configuration. See https://nextjs.org/docs/basic-features/eslint#migrating-existing-config
helix: info  - Creating an optimized production build...
helix: info  - Disabled SWC as replacement for Babel because of custom Babel configuration ".babelrc" https://nextjs.org/docs/messages/swc-disabled
helix: info  - Using external babel configuration from /Users/shaoxuelei/projects/itering/helix-ui/packages/helix/.babelrc
helix: warn - Tailwind is not purging unused styles because no template paths have been provided.
helix: warn - If you have manually configured PurgeCSS outside of Tailwind or are deliberately not removing unused styles, set `purge: false` in your Tailwind config file to silence this warning.
helix: warn - https://tailwindcss.com/docs/controlling-file-size/#removing-unused-css
helix: info  - Compiled successfully
helix: info  - Collecting page data...
helix: ⛓️ Chains environment: formal; 🖥️ Runtime environment: production
helix: ⛓️ Chains environment: formal; 🖥️ Runtime environment: production
helix: ⛓️ Chains environment: formal; 🖥️ Runtime environment: production
helix: ⛓️ Chains environment: formal; 🖥️ Runtime environment: production
helix: ⛓️ Chains environment: formal; 🖥️ Runtime environment: production
helix: ⛓️ Chains environment: formal; 🖥️ Runtime environment: production
helix: ⛓️ Chains environment: formal; 🖥️ Runtime environment: production
helix: info  - Generating static pages (0/6)
helix: react-i18next:: You will need to pass in an i18next instance by using initReactI18next
helix: react-i18next:: You will need to pass in an i18next instance by using initReactI18next
helix: react-i18next:: You will need to pass in an i18next instance by using initReactI18next
helix: react-i18next:: You will need to pass in an i18next instance by using initReactI18next
helix: react-i18next:: You will need to pass in an i18next instance by using initReactI18next
helix: react-i18next:: You will need to pass in an i18next instance by using initReactI18next
helix: info  - Generating static pages (1/6)
helix: info  - Generating static pages (2/6)
helix: info  - Generating static pages (4/6)
helix: info  - Generating static pages (6/6)
helix: info  - Finalizing page optimization...
helix: Page                                       Size     First Load JS
helix: ┌ λ /                                      314 kB         1.93 MB
helix: ├   └ css/e58231e4197f4ee0.css             2.36 kB
helix: ├   /_app                                  0 B            1.61 MB
helix: ├ ○ /404                                   284 B          1.61 MB
helix: ├ ○ /500                                   289 B          1.61 MB
helix: ├ λ /api/hello                             0 B            1.61 MB
helix: ├ λ /transaction                           95.8 kB        1.71 MB
helix: ├   └ css/a96f1ff9be9b7e99.css             11.3 kB
helix: ├ λ /transaction/cbridge/[id]              687 B          1.63 MB
helix: ├ λ /transaction/s2dvm/[id]                729 B          1.63 MB
helix: ├ λ /transaction/s2parachain/[id]          693 B          1.63 MB
helix: ├ λ /transaction/s2s/[id]                  720 B          1.63 MB
helix: ├ λ /transaction/s2sv2/[id]                702 B          1.63 MB
helix: └ λ /transaction/xcm/[id]                  600 B          1.63 MB
helix: + First Load JS shared by all              1.61 MB
helix:   ├ chunks/framework-9de8fade601d6062.js   45 kB
helix:   ├ chunks/main-fedbb77d25194085.js        27.1 kB
helix:   ├ chunks/pages/_app-89b514a611337eba.js  1.53 MB
helix:   ├ chunks/webpack-a110ee52e8ef03d6.js     1.86 kB
helix:   └ css/92f46a03ac51c52a.css               507 kB
helix: λ  (Server)  server-side renders at runtime (uses getInitialProps or getServerSideProps)
helix: ○  (Static)  automatically rendered as static HTML (uses no initial props)
lerna success run Ran npm script 'build' in 1 package in 188.3s:
lerna success - helix
✨  Done in 188.97s.

apps

~/projects/itering/helix-ui/ [bundle_optimize] yarn build:apps
yarn run v1.22.17
$ node_modules/.bin/lerna run --scope apps --stream build
lerna notice cli v4.0.0
lerna notice filter including "apps"
lerna info filter [ 'apps' ]
lerna info Executing command in 1 package: "yarn run build"
apps: $ next build
apps: info  - Loaded env from /Users/shaoxuelei/projects/itering/helix-ui/packages/apps/.env.production
apps: warn  - You have enabled experimental feature(s).
apps: warn  - Experimental features are not covered by semver, and may cause unexpected or broken application behavior. Use them at your own risk.
apps: info  - Checking validity of types...
apps: warn  - The Next.js plugin was not detected in your ESLint configuration. See https://nextjs.org/docs/basic-features/eslint#migrating-existing-config
apps: info  - Creating an optimized production build...
apps: info  - Disabled SWC as replacement for Babel because of custom Babel configuration ".babelrc" https://nextjs.org/docs/messages/swc-disabled
apps: info  - Using external babel configuration from /Users/shaoxuelei/projects/itering/helix-ui/packages/apps/.babelrc
apps: warn - Tailwind is not purging unused styles because no template paths have been provided.
apps: warn - If you have manually configured PurgeCSS outside of Tailwind or are deliberately not removing unused styles, set `purge: false` in your Tailwind config file to silence this warning.
apps: warn - https://tailwindcss.com/docs/controlling-file-size/#removing-unused-css
apps: [BABEL] Note: The code generator has deoptimised the styling of /Users/shaoxuelei/projects/itering/helix-ui/packages/apps/bridges/celer/cBridge/ts-proto/gateway/gateway_pb.js as it exceeds the max of 500KB.
apps: [BABEL] Note: The code generator has deoptimised the styling of /Users/shaoxuelei/projects/itering/helix-ui/packages/apps/bridges/celer/cBridge/ts-proto/gateway/gateway_pb.js as it exceeds the max of 500KB.
apps: info  - Compiled successfully
apps: info  - Collecting page data...
apps: ⛓️ Chains environment: formal; 🖥️ Runtime environment: production
apps: ⛓️ Chains environment: formal; 🖥️ Runtime environment: production
apps: ⛓️ Chains environment: formal; 🖥️ Runtime environment: production
apps: ⛓️ Chains environment: formal; 🖥️ Runtime environment: production
apps: ⛓️ Chains environment: formal; 🖥️ Runtime environment: production
apps: info  - Generating static pages (0/8)
apps: react-i18next:: You will need to pass in an i18next instance by using initReactI18next
apps: react-i18next:: You will need to pass in an i18next instance by using initReactI18next
apps: react-i18next:: You will need to pass in an i18next instance by using initReactI18next
apps: react-i18next:: You will need to pass in an i18next instance by using initReactI18next
apps: info  - Generating static pages (2/8)
apps: info  - Generating static pages (4/8)
apps: info  - Generating static pages (6/8)
apps: ⛓️ Chains environment: formal; 🖥️ Runtime environment: production
apps: ⛓️ Chains environment: formal; 🖥️ Runtime environment: production
apps: react-i18next:: You will need to pass in an i18next instance by using initReactI18next
apps: react-i18next:: You will need to pass in an i18next instance by using initReactI18next
apps: info  - Generating static pages (8/8)
apps: info  - Finalizing page optimization...
apps: Page                                       Size     First Load JS
apps: ┌ ● /                                      9.17 kB        2.07 MB
apps: ├   └ css/8b29d979f6c251fe.css             147 B
apps: ├   /_app                                  0 B            2.06 MB
apps: ├ ○ /404 (3341 ms)                         284 B          2.06 MB
apps: ├ ○ /500 (3361 ms)                         289 B          2.06 MB
apps: └ λ /api/hello                             0 B            2.06 MB
apps: + First Load JS shared by all              2.06 MB
apps:   ├ chunks/framework-9de8fade601d6062.js   45 kB
apps:   ├ chunks/main-fedbb77d25194085.js        27.1 kB
apps:   ├ chunks/pages/_app-8dd00fe0269f7f2a.js  1.99 MB
apps:   ├ chunks/webpack-42076597a433d010.js     2.06 kB
apps:   └ css/cecfe814573589ac.css               549 kB
apps: λ  (Server)  server-side renders at runtime (uses getInitialProps or getServerSideProps)
apps: ○  (Static)  automatically rendered as static HTML (uses no initial props)
apps: ●  (SSG)     automatically generated as static HTML + JSON (uses getStaticProps)
lerna success run Ran npm script 'build' in 1 package in 223.8s:
lerna success - apps
✨  Done in 224.39s.

merged apps

~/projects/itering/helix-ui/packages/apps/ [bundle_optimize*] yarn analyze
yarn run v1.22.17
$ cross-env ANALYZE=true next build
info  - Loaded env from /Users/shaoxuelei/projects/itering/helix-ui/packages/apps/.env.production
warn  - You have enabled experimental feature(s).
warn  - Experimental features are not covered by semver, and may cause unexpected or broken application behavior. Use them at your own risk.

info  - Checking validity of types
warn  - The Next.js plugin was not detected in your ESLint configuration. See https://nextjs.org/docs/basic-features/eslint#migrating-existing-config
info  - Disabled SWC as replacement for Babel because of custom Babel configuration ".babelrc" https://nextjs.org/docs/messages/swc-disabled
info  - Using external babel configuration from /Users/shaoxuelei/projects/itering/helix-ui/packages/apps/.babelrc

warn - Tailwind is not purging unused styles because no template paths have been provided.
warn - If you have manually configured PurgeCSS outside of Tailwind or are deliberately not removing unused styles, set `purge: false` in your Tailwind config file to silence this warning.
warn - https://tailwindcss.com/docs/controlling-file-size/#removing-unused-css
[BABEL] Note: The code generator has deoptimised the styling of /Users/shaoxuelei/projects/itering/helix-ui/packages/apps/bridges/celer/cBridge/ts-proto/gateway/gateway_pb.js as it exceeds the max of 500KB.
Webpack Bundle Analyzer saved report to /Users/shaoxuelei/projects/itering/helix-ui/packages/apps/.next/analyze/client.html
[BABEL] Note: The code generator has deoptimised the styling of /Users/shaoxuelei/projects/itering/helix-ui/packages/apps/bridges/celer/cBridge/ts-proto/gateway/gateway_pb.js as it exceeds the max of 500KB.
Webpack Bundle Analyzer saved report to /Users/shaoxuelei/projects/itering/helix-ui/packages/apps/.next/server/analyze/server.html

No bundles were parsed. Analyzer will show only original module sizes from stats file.

Webpack Bundle Analyzer saved report to /Users/shaoxuelei/projects/itering/helix-ui/packages/apps/.next/analyze/server.html
info  - Creating an optimized production build
info  - Compiled successfully
info  - Collecting page data ..⛓️ Chains environment: formal; 🖥️ Runtime environment: production; 🙈Deployment environment: undefined
⛓️ Chains environment: formal; 🖥️ Runtime environment: production; 🙈Deployment environment: undefined
info  - Collecting page data .⛓️ Chains environment: formal; 🖥️ Runtime environment: production; 🙈Deployment environment: undefined
⛓️ Chains environment: formal; 🖥️ Runtime environment: production; 🙈Deployment environment: undefined
⛓️ Chains environment: formal; 🖥️ Runtime environment: production; 🙈Deployment environment: undefined
⛓️ Chains environment: formal; 🖥️ Runtime environment: production; 🙈Deployment environment: undefined
⛓️ Chains environment: formal; 🖥️ Runtime environment: production; 🙈Deployment environment: undefined
info  - Collecting page data ..@polkadot/util has multiple versions, ensure that there is only one installed.
Either remove and explicitly install matching versions or dedupe using your package manager.
The following conflicting packages were found:
	cjs 10.1.4	node_modules/@polkadot/util/cjs
	esm 10.1.4	node_modules/@polkadot/util/
@polkadot/util has multiple versions, ensure that there is only one installed.
Either remove and explicitly install matching versions or dedupe using your package manager.
The following conflicting packages were found:
	cjs 10.1.4	node_modules/@polkadot/util/cjs
	esm 10.1.4	node_modules/@polkadot/util/
@polkadot/util has multiple versions, ensure that there is only one installed.
Either remove and explicitly install matching versions or dedupe using your package manager.
The following conflicting packages were found:
	cjs 10.1.4	node_modules/@polkadot/util/cjs
	esm 10.1.4	node_modules/@polkadot/util/
@polkadot/util has multiple versions, ensure that there is only one installed.
Either remove and explicitly install matching versions or dedupe using your package manager.
The following conflicting packages were found:
	cjs 10.1.4	node_modules/@polkadot/util/cjs
	esm 10.1.4	node_modules/@polkadot/util/
@polkadot/util has multiple versions, ensure that there is only one installed.
Either remove and explicitly install matching versions or dedupe using your package manager.
The following conflicting packages were found:
	cjs 10.1.4	node_modules/@polkadot/util/cjs
	esm 10.1.4	node_modules/@polkadot/util/
@polkadot/util has multiple versions, ensure that there is only one installed.
Either remove and explicitly install matching versions or dedupe using your package manager.
The following conflicting packages were found:
	cjs 10.1.4	node_modules/@polkadot/util/cjs
	esm 10.1.4	node_modules/@polkadot/util/
info  - Collecting page data ...@polkadot/util has multiple versions, ensure that there is only one installed.
Either remove and explicitly install matching versions or dedupe using your package manager.
The following conflicting packages were found:
	cjs 10.1.4	node_modules/@polkadot/util/cjs
	esm 10.1.4	node_modules/@polkadot/util/
info  - Collecting page data
[    ] info  - Generating static pages (0/8)react-i18next:: You will need to pass in an i18next instance by using initReactI18next
react-i18next:: You will need to pass in an i18next instance by using initReactI18next
react-i18next:: You will need to pass in an i18next instance by using initReactI18next
react-i18next:: You will need to pass in an i18next instance by using initReactI18next
react-i18next:: You will need to pass in an i18next instance by using initReactI18next
react-i18next:: You will need to pass in an i18next instance by using initReactI18next
info  - Generating static pages (8/8)
info  - Finalizing page optimization

Page                                       Size     First Load JS
┌ λ /                                      241 kB         2.25 MB
├   /_app                                  0 B            2.01 MB
├ ○ /404                                   284 B          2.01 MB
├ ○ /500                                   289 B          2.01 MB
├ λ /api/hello                             0 B            2.01 MB
├ ● /apps                                  11 kB          2.02 MB
├   └ css/8b29d979f6c251fe.css             147 B
├ λ /transaction                           66.7 kB        2.08 MB
├   └ css/54033a82d6c79f4a.css             5.34 kB
├ λ /transaction/cbridge/[id]              682 B          2.02 MB
├ λ /transaction/s2dvm/[id]                723 B          2.02 MB
├ λ /transaction/s2parachain/[id]          686 B          2.02 MB
├ λ /transaction/s2s/[id]                  714 B          2.02 MB
├ λ /transaction/s2sv2/[id]                699 B          2.02 MB
└ λ /transaction/xcm/[id]                  598 B          2.02 MB
+ First Load JS shared by all              2.01 MB
  ├ chunks/framework-9de8fade601d6062.js   45 kB
  ├ chunks/main-fedbb77d25194085.js        27.1 kB
  ├ chunks/pages/_app-ca902f13ef5c2428.js  1.94 MB
  ├ chunks/webpack-a072d69898c22423.js     2.14 kB
  └ css/036f4f98ffb4e8f6.css               549 kB

λ  (Server)  server-side renders at runtime (uses getInitialProps or getServerSideProps)
○  (Static)  automatically rendered as static HTML (uses no initial props)
●  (SSG)     automatically generated as static HTML + JSON (uses getStaticProps)

✨  Done in 180.96s.
@sxlwar
Copy link
Contributor Author

sxlwar commented Sep 2, 2022

image

@sxlwar
Copy link
Contributor Author

sxlwar commented Sep 5, 2022

web3/web3.js#1178

@sxlwar
Copy link
Contributor Author

sxlwar commented Sep 5, 2022

replace web3 with ethers.js

Page                                       Size     First Load JS
apps: ┌ λ /                                      241 kB         1.45 MB
apps: ├   /_app                                  0 B            1.21 MB
apps: ├ ○ /404                                   284 B          1.21 MB
apps: ├ ○ /500                                   289 B          1.21 MB
apps: ├ λ /api/hello                             0 B            1.21 MB
apps: ├ ● /apps                                  11 kB          1.22 MB
apps: ├   └ css/8b29d979f6c251fe.css             147 B
apps: ├ λ /transaction                           66.7 kB        1.28 MB
apps: ├   └ css/54033a82d6c79f4a.css             5.34 kB
apps: ├ λ /transaction/cbridge/[id]              682 B          1.23 MB
apps: ├ λ /transaction/s2dvm/[id]                723 B          1.23 MB
apps: ├ λ /transaction/s2parachain/[id]          686 B          1.23 MB
apps: ├ λ /transaction/s2s/[id]                  714 B          1.23 MB
apps: ├ λ /transaction/s2sv2/[id]                699 B          1.23 MB
apps: └ λ /transaction/xcm/[id]                  598 B          1.23 MB
apps: + First Load JS shared by all              1.21 MB
apps:   ├ chunks/framework-9de8fade601d6062.js   45 kB
apps:   ├ chunks/main-fedbb77d25194085.js        27.1 kB
apps:   ├ chunks/pages/_app-fd86b0b58fab8d61.js  1.14 MB
apps:   ├ chunks/webpack-84152764bed3ae7f.js     2.15 kB
apps:   └ css/036f4f98ffb4e8f6.css               549 kB
apps: λ  (Server)  server-side renders at runtime (uses getInitialProps or getServerSideProps)
apps: ○  (Static)  automatically rendered as static HTML (uses no initial props)
apps: ●  (SSG)     automatically generated as static HTML + JSON (uses getStaticProps)
lerna success run Ran npm script 'build' in 1 package in 79.2s:
lerna success - apps
✨  Done in 80.24s.

image

Refactored bridge component loading strategy

Page                                       Size     First Load JS
┌ λ /                                      245 kB         1.12 MB
├   └ css/b993051e0ab3fae2.css             1 kB
├   /_app                                  0 B             874 kB
├ ○ /404                                   284 B           874 kB
├ ○ /500                                   289 B           874 kB
├ λ /api/hello                             0 B             874 kB
├ ● /apps                                  215 kB         1.13 MB
├   └ css/0178c0ace08d918f.css             16.1 kB
├ λ /transaction                           68.4 kB         976 kB
├   └ css/fdd47b9eb3b4ca42.css             5.33 kB
├ λ /transaction/cbridge/[id]              686 B           894 kB
├ λ /transaction/s2dvm/[id]                726 B           894 kB
├ λ /transaction/s2parachain/[id]          692 B           894 kB
├ λ /transaction/s2s/[id]                  719 B           894 kB
├ λ /transaction/s2sv2/[id]                703 B           894 kB
└ λ /transaction/xcm/[id]                  601 B           894 kB
+ First Load JS shared by all              874 kB
  ├ chunks/framework-9de8fade601d6062.js   45 kB
  ├ chunks/main-fedbb77d25194085.js        27.1 kB
  ├ chunks/pages/_app-183389991bdcb076.js  799 kB
  ├ chunks/webpack-2bcd5b9e22754654.js     2.56 kB
  └ css/b06fe8853bfe1b4f.css               504 kB

λ  (Server)  server-side renders at runtime (uses getInitialProps or getServerSideProps)
○  (Static)  automatically rendered as static HTML (uses no initial props)
●  (SSG)     automatically generated as static HTML + JSON (uses getStaticProps)

✨  Done in 72.79s.

@sxlwar
Copy link
Contributor Author

sxlwar commented Sep 5, 2022

web3 1.5.3

apps: Page                                       Size     First Load JS
apps: ┌ λ /                                      241 kB         2.13 MB
apps: ├   /_app                                  0 B            1.89 MB
apps: ├ ○ /404                                   284 B          1.89 MB
apps: ├ ○ /500                                   289 B          1.89 MB
apps: ├ λ /api/hello                             0 B            1.89 MB
apps: ├ ● /apps                                  11 kB           1.9 MB
apps: ├   └ css/8b29d979f6c251fe.css             147 B
apps: ├ λ /transaction                           66.7 kB        1.96 MB
apps: ├   └ css/54033a82d6c79f4a.css             5.34 kB
apps: ├ λ /transaction/cbridge/[id]              682 B           1.9 MB
apps: ├ λ /transaction/s2dvm/[id]                723 B           1.9 MB
apps: ├ λ /transaction/s2parachain/[id]          686 B           1.9 MB
apps: ├ λ /transaction/s2s/[id]                  714 B           1.9 MB
apps: ├ λ /transaction/s2sv2/[id]                699 B           1.9 MB
apps: └ λ /transaction/xcm/[id]                  598 B           1.9 MB
apps: + First Load JS shared by all              1.89 MB
apps:   ├ chunks/framework-9de8fade601d6062.js   45 kB
apps:   ├ chunks/main-fedbb77d25194085.js        27.1 kB
apps:   ├ chunks/pages/_app-6ca36e846b54efe1.js  1.82 MB
apps:   ├ chunks/webpack-a072d69898c22423.js     2.14 kB
apps:   └ css/036f4f98ffb4e8f6.css               549 kB
apps: λ  (Server)  server-side renders at runtime (uses getInitialProps or getServerSideProps)
apps: ○  (Static)  automatically rendered as static HTML (uses no initial props)
apps: ●  (SSG)     automatically generated as static HTML + JSON (uses getStaticProps)
lerna success run Ran npm script 'build' in 1 package in 95.0s:
lerna success - apps
✨  Done in 95.55s.

@sxlwar
Copy link
Contributor Author

sxlwar commented Sep 5, 2022

branch packaging time first load js first load js shared
bundle_optimize (web3_1.7.3) 180.96s 2.25Mb 2.01MB
bundle_optimize_ethers 80.24s 1.45Mb 1.21MB
bundle_optimize_web3_1.5.3 95.55s 2.13Mb 1.89MB
bundle_optimize_ethers (lazyload bridge components) 72.79s 1.12Mb 874K
bundle_optimize_ethers finialize 54.88s 1.06Mb 809K

@sxlwar
Copy link
Contributor Author

sxlwar commented Sep 8, 2022

crush lodash

Page                                       Size     First Load JS
┌ λ /                                      244 kB          1.1 MB
├   └ css/b993051e0ab3fae2.css             1 kB
├   /_app                                  0 B             852 kB
├ ○ /404                                   284 B           853 kB
├ ○ /500                                   289 B           853 kB
├ λ /api/hello                             0 B             852 kB
├ ● /apps                                  215 kB          1.1 MB
├   └ css/0178c0ace08d918f.css             16.1 kB
├ λ /transaction                           68.4 kB         954 kB
├   └ css/fdd47b9eb3b4ca42.css             5.33 kB
├ λ /transaction/cbridge/[id]              686 B           872 kB
├ λ /transaction/s2dvm/[id]                726 B           872 kB
├ λ /transaction/s2parachain/[id]          692 B           872 kB
├ λ /transaction/s2s/[id]                  719 B           872 kB
├ λ /transaction/s2sv2/[id]                703 B           872 kB
└ λ /transaction/xcm/[id]                  601 B           872 kB
+ First Load JS shared by all              852 kB
  ├ chunks/framework-9de8fade601d6062.js   45 kB
  ├ chunks/main-fedbb77d25194085.js        27.1 kB
  ├ chunks/pages/_app-e4369f3e98f76d8a.js  778 kB
  ├ chunks/webpack-584faa1bb01e6da9.js     2.56 kB
  └ css/b06fe8853bfe1b4f.css               504 kB

λ  (Server)  server-side renders at runtime (uses getInitialProps or getServerSideProps)
○  (Static)  automatically rendered as static HTML (uses no initial props)
●  (SSG)     automatically generated as static HTML + JSON (uses getStaticProps)

✨  Done in 71.39s

image

@sxlwar
Copy link
Contributor Author

sxlwar commented Sep 8, 2022

css bundle

before

Permissions Size User       Date Modified Name
.rw-r--r--  137k shaoxuelei  8 9 09:50    0178c0ace08d918f.css
.rw-r--r--   44k shaoxuelei  8 9 09:50    9ae56f4e40ded70a.css
.rw-r--r--   238 shaoxuelei  8 9 09:50    670e385b57114c91.css
.rw-r--r--  6.2M shaoxuelei  8 9 09:50    b06fe8853bfe1b4f.css
.rw-r--r--  3.5k shaoxuelei  8 9 09:50    b993051e0ab3fae2.css
.rw-r--r--  5.0k shaoxuelei  8 9 09:50    dea6091200bdb1c8.css
.rw-r--r--   38k shaoxuelei  8 9 09:50    fdd47b9eb3b4ca42.css

updated

Permissions Size User       Date Modified Name
.rw-r--r--  137k shaoxuelei  8 9 13:53    43db6ac675dadbc1.css
.rw-r--r--   238 shaoxuelei  8 9 13:53    670e385b57114c91.css
.rw-r--r--  199k shaoxuelei  8 9 13:53    173320d99661c452.css
.rw-r--r--  3.5k shaoxuelei  8 9 13:53    b993051e0ab3fae2.css
.rw-r--r--   38k shaoxuelei  8 9 13:53    bd4729d00582d7f1.css
.rw-r--r--  5.0k shaoxuelei  8 9 13:53    dea6091200bdb1c8.css
.rw-r--r--   44k shaoxuelei  8 9 13:53    e9c4ec35dd62b5bb.css

@sxlwar
Copy link
Contributor Author

sxlwar commented Sep 9, 2022

The End

Page                                       Size     First Load JS
┌ λ /                                      244 kB         1.06 MB
├   └ css/b993051e0ab3fae2.css             1 kB
├   /_app                                  0 B             809 kB
├ ○ /404                                   284 B           809 kB
├ ○ /500                                   289 B           809 kB
├ λ /api/hello                             0 B             809 kB
├ ● /apps                                  52.3 kB         875 kB
├   └ css/7908c4bbb7f61013.css             14.3 kB
├ λ /transaction                           98.8 kB         924 kB
├   ├ css/3d42f7af571b1189.css             3.73 kB
├   └ css/a275f55dc8670fff.css             6.89 kB
├ λ /transaction/cbridge/[id]              684 B           828 kB
├ λ /transaction/s2dvm/[id]                729 B           828 kB
├ λ /transaction/s2parachain/[id]          690 B           828 kB
├ λ /transaction/s2s/[id]                  717 B           828 kB
├ λ /transaction/s2sv2/[id]                701 B           828 kB
└ λ /transaction/xcm/[id]                  600 B           828 kB
+ First Load JS shared by all              809 kB
  ├ chunks/framework-9de8fade601d6062.js   45 kB
  ├ chunks/main-fedbb77d25194085.js        27.1 kB
  ├ chunks/pages/_app-bf33c4da6e4140a1.js  734 kB
  ├ chunks/webpack-abbf01b6bb144ea1.js     2.8 kB
  └ css/d5ea5910bb7cfff0.css               22.5 kB

λ  (Server)  server-side renders at runtime (uses getInitialProps or getServerSideProps)
○  (Static)  automatically rendered as static HTML (uses no initial props)
●  (SSG)     automatically generated as static HTML + JSON (uses getStaticProps)

✨  Done in 54.88s.

Now, the biggest impact on package size is Polkadot-js, see polkadot-js/api#5209

Dashboard

image

Apps

image

More network requests on the dashboard result in a lower score than the apps page, even though the size of apps is much larger than the homepage

@sxlwar sxlwar closed this as completed Sep 15, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant