When I build my NextJS project to production, it generates many chunks with names that I cant determine their origin.
I disabled all the dynamic imports I have in my app, I disabled all the css imports I have in my app (commented them out), yet, it still generate these chunks.
As you can see, these chunks are shared by all my pages. All the chunks with hashes, are unknown to me, no idea where they come from or what they hold.
When using google page speed, I see that they are loaded but unused (obviously, I tested it on empty page, yet they are being loaded).
How can I understand what are these chunks? (tried to use chunkFilename in the webpack config, maybe I used bad values, but all the options result with id/chunkhash/name that doesnt help me to understand where they are coming from)
EDIT:
thanks to @juliomalves comment, I used bundle analyzer to see what 2 of these chunks hold (the biggest ones), it appears that they use code that should be in used, so I dont get why google pagespeed says they are not in use. (first chunk has i18n stuff (appWithTranslation), second chunk has firebase stuff (init) which both are part of the _app.js and therefore they are in use), so why does google pagespeed says they are not in use?
The score of the page goes down because of that and it effects SEO.



