Investigate the impact of used packages on our final bundle size #1461
Description
For example, ethers takes 14kB in a production build of apps/demo-react-vite.
The easiest way to check the effect of a package on size is to go to apps/demo-react-vite/vite.config.ts and set the package as external in build.rollupOptions.external:
import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'
// https://vitejs.dev/config/
export default defineConfig({
plugins: [react()],
build: {
rollupOptions: {
external: ["ethers"]
}
}
})This excludes that specific package from the build because it expects it to be provided from an external source instead of bundling it together with the app.
We can also use this approach to exclude our own packages that are included via "workspace:*" and to see how much each of them weighs.
This can help us in focusing our efforts for #1460.