Counter argument

[icyJoseph]

Hi,

I notice the claim here is based on the all result on the bundle analyzer.

However if we inspect the transferred JS to load the landing page:

app

pages

So what gives? well the key is the main-cea54f6ff400d8c7 module, when is it downloaded? If we, in the app dir branch, go to localhost:3000/foo, we see the 404 page, and in the downloaded assets:

My conclusion is that taking the all value in the @next/bundle-analyzer as a total count for the transferred JS per page, is not correct. Nor is it necessarily the Filter to initial chunks > app/page filter in the UI.

[kallebertell]

@icyJoseph Thanks for looking into this. We'll confirm your results, and also get this deployed on Vercel so we can test it with pagespeed insights to see if the conclusions are the same.

If so we'll have to return to the original project (which we can't share) with the problem and produce a new hypothesis why its TBT doubled due to an app dir conversion.

[icyJoseph]

Great! Perhaps you are shipping tons of JSON data for each page.

You can use Jack Herrinton's tool, https://github.com/jherr/njs13-n-plus-one/blob/main/tester/index.js

• create a new folder wherever, this is the tester tool
• init a package.json yarn init for example
• install cheerio example: yarn add cheerio
• create an index file with the contents of https://github.com/jherr/njs13-n-plus-one/blob/main/tester/index.js
• run your project (w/ next start)
• run the tester tool (notice I use 0.0.0.0:3000)

node index.js http://0.0.0.0:3000
Found client data key: 1
Found client data key: 2
Found client data key: 3
http://0.0.0.0:3000
            HTML: 44.17 KB - 57.0%
            JSON: 33.36 KB - 43.0%
JSON Client Data: 6.95 KB - 20.8%

Now you can see your initial page load from another perspective, not only JS.

More here: https://youtu.be/FfHsIio4aCU?t=1117

[icyJoseph]

One additional thing, you could also share the pagespeed result URL, and from there we could also help each other, it even gives access to the tree view - which might be key in this case.