crypto is leaking into the frontend, causing 100kb of useless js

[boehs]

Describe the Bug

I'm not entirely sure why it is leaking into the frontend, perhaps there is an instance somewhere where it is used, but the WebCrypto api should certainly be used instead for this case. Of course, on the server, using the node crypto API is fine, it just shouldn't be included in the browser.

Pictured: the bundle analysis for the dashboard page. Box sizes are gzipped size

Well, how is crypto in the browser anyway, if it's a node API? It's crypto-browserify, and from this thread https://github.com/vercel/next.js/issues/40271, next is being "helpful" and automatically polyfilling it, instead of throwing an error like it should.

I've reproduced this on the umami demo page, it's definitely included in https://analytics.umami.is/_next/static/chunks/aaea2bcf-f0688fdf9e559bfa.js. Fixing this would reduce the initial script download for all pages by about 1/6th. If I can find it, I will let you know.

experimental.fallbackNodePolyfills: false

When this is done, the following error appears

This is telling me your library next-basics could be the culprit

edit: it is, for whatever reason the node module is being rolled up before being uploading to npm: https://www.npmjs.com/package/next-basics?activeTab=code, where we can clearly see the crypto import, and I don't think treeshaking is working too well here. Assuming you have a reason to be doing it this way, I would do next-basics/server for the crypto stuff in the rollup