Reducing size of JS request chain

[benmccann]

https://developers.google.com/speed/pagespeed/insights/?url=https%3A%2F%2Frealworld.svelte.dev%2F

It looks to me like the request chain gets deeper each time a component imports another component. I wonder how scalable this is. On the one hand, it means downloads for subsequent page navigations will be smaller because those components may have been downloaded on previous pages. But on the other hand, I imagine you could easily end up with some pretty long download chains. E.g. client.js only has a few lines in it and does very little except request two other files, which adds latency for little benefit

[benmccann]

I found out that the biggest part of the problem is the Rollup configuration used in the Realworld example. I sent a PR to fix that by making it match the sapper template, which makes it quite a bit better: sveltejs/realworld#55. I'll try to take a look to see if there's more we can or should do on top of that

[Conduitry]

This was automatically closed when I merged the above PR, but reopening in case there's more that ought to happen here.

[benmccann]

Unfortunately we're still not at a 100 on the Lighthouse Page Speed score after merging sveltejs/realworld#55. Though 95 is still better than the vast majority of JS frameworks 😄

The JS request chain is improved and is now three deep: client.js -> index.js -> components

I found rollup-plugin-hoist-import-deps which looks like it should further improve things by requesting index.js (or whatever page you're on) its components in parallel, which would reduce the request chain to two.

However, I think that we could do better still and request everything in parallel. Right now, client.js is loaded by the client and then figures out on the client side what js resources to load next based on the page you're on. However, that work could be done server-side instead and then those resources could all be preloaded #408. For many CDNs that would mean those resources would get pushed with the initial request and there would be basically no additional requests.