The NextJS bundle analyzer gives some output like this:
Page Size First Load JS
┌ λ / 12 kB 368 kB
├ └ 79.202101.46dabc.chunk.css 10.3 kB
...
+ First Load JS shared by all 195 kB
├ chunks/0e69992b3e9a8d51f37748cf97b75268d47a0f0c.f372af.js 27.6 kB
├ chunks/cf0e5769c2fa5761a95adfa95a4e062fb86f8f05.272397.js 91.4 kB
├ chunks/commons.9707f2.js 9.01 kB
├ chunks/framework.efaa9a.js 46.9 kB
├ chunks/main.9965a5.js 6.39 kB
├ chunks/pages/_app.a4ce0d.js 11.4 kB
├ chunks/webpack.8e3a04.js 2.72 kB
└ 62.202101.796f1f.chunk.css 3.7 kB
What exactly does "First Load JS" measure and why does it not equal the sum of "First Load JS shared by all" and the size of the page and it's sub-pages. I.e. based on this output I would expect First Load JS to equal 12 kb + 10.3 kb + 195 kb, not 368 kb.
Thanks.
Here's what the docs say:
Size – The number of assets downloaded when navigating to the page client-side. The size for each route only includes its dependencies.
First Load JS – The number of assets downloaded when visiting the page from the server. The amount of JS shared by all is shown as a separate metric.
If you're reading the above and annoyed by the circular references, you're not alone. The output is extra confusing in your case because you only have one route listed (though presumably more you cut off), but the docs do, somewhat helpfully, note that "the output displays information about each route."
Basically, when a user hits the site the first time, they'll download the First Load JS for their requested route from the server first, then start loading additional assets client-side as the page renders.
The UX of this output is super confusing, but once you understand the terms, the numbers actually do add up.
First Load JS shared by all, in contrast, refers to JS assets shared across (and loaded when visiting) every single route. In your case, First Load JS shared by all = 195KB, which is (approximately) equal to (27.6+91.4+9.01+46.9+6.39+11.4+2.72) ... the css apparently isn't included, (I guess for the sole reason that it's not JS, which seems dumb, but whatever).
The point of the "shared by all" metric is that if you can reduce that number you'll reduce the amount your users have to download on every single route, so it's ostensibly a good place to start optimizing.