Use browser APIs to calculate Blazor's download size

[pranavkm]

The publish sizes in our Benchmarks have been broken since the change to the output structure. Looking at the size on disk is also a little cumbersome, since we have to not double count. It seems like it's much more useful to measure the network download size instead.

[pranavkm]

This seemed "easy" to do, but if there's a better way to approach this, let me know.

[pranavkm]

Most of this is just whitespace changes.

[pranavkm]

Again, if there's a better way to do this, I'd be happy to use it. This launches a page in an iframe that wires up the new hook that I added. The contents of the iframe are slightly different because we need to hook up the callback after Blazor's scripts have been initialized, but before downloads happen. The instance of chrome in docker does caching correctly, so relying on caching to happen isn't problematic.

[javiercn]

I think this deserves a more in-depth discussion. There are alternative ways we can do this, that feel simpler to me:

• Skip .gz files when computing the size (as those are compressed files).
• Use chrome Remote DevTools Protocol to query the size of the downloaded bits.

[pranavkm]

Skip .gz files when computing the size (as those are compressed files).

I wanted to avoid calculating the sizes in the Benchmark test. It's easy to miss updating the benchmark if we happen to change Blazor's publishing.

Use chrome Remote DevTools Protocol to query the size of the downloaded bits.

That sounds nifty. How does this work?

[SteveSandersonMS]

I think this deserves a more in-depth discussion. There are alternative ways we can do this, that feel simpler to me

I agree. This approach is a bit awkward since it couples us to some internal implementation details, plus it's unable to measure the actual total size including blazor.webassembly.js and any other dependencies we add in the future.

As well as @javiercn's suggestions, another possibly simpler alternative would be to use the performance APIs but not via Blazor's data collection. For example:

1. If you might need to clear existing caches, execute caches.keys().then(keys => keys.forEach(key => caches.delete(keys)))
2. Reload the page
3. Evaluate performance.getEntries().filter(x => x.encodedBodySize).map(x => ({ name: x.name, encodedBodySize: x.encodedBodySize }))

That last expression will give you all the HTTP requests, including for the initial HTML. You can observe both encodedBodySize and decodedBodySize if you want.

If you just want the total transferred size, it's performance.getEntries().reduce((prev, next) => (next.encodedBodySize || 0) + prev, 0). (I know you could figure that out yourself, but I just did it so there you go :) )

[pranavkm]

@SteveSandersonMS the performance trick helped.

[pranavkm]

This has been updated.

[javiercn]

Much better!

[pranavkm]

FYI @sebastienros