Live data from Hacker News

CSS and JS code coverage in Chrome DevTools

developers.google.com

31–40 of 130 posts

Re: CSS and JS code coverage in Chrome DevTools

#32

My vague recollection of the Google event where this was first announced (was it late 2016 or early 2017?) - was it was going to "record" your site usage for as long as you were "recording" - and give the report at the end. But this now sounds like a coverage tool for a single page? Does anyone know if it can record over multiple pages and/or application usage (such as an SPA)?

[deleted]

Re: CSS and JS code coverage in Chrome DevTools

#33

My vague recollection of the Google event where this was first announced (was it late 2016 or early 2017?) - was it was going to "record" your site usage for as long as you were "recording" - and give the report at the end. But this now sounds like a coverage tool for a single page? Does anyone know if it can record over multiple pages and/or application usage (such as an SPA)?

It should be able to record over a SPA if there are no hard reloads. I don't think it can record over multiple pages though.

Re: CSS and JS code coverage in Chrome DevTools

#35

My vague recollection of the Google event where this was first announced (was it late 2016 or early 2017?) - was it was going to "record" your site usage for as long as you were "recording" - and give the report at the end. But this now sounds like a coverage tool for a single page? Does anyone know if it can record over multiple pages and/or application usage (such as an SPA)?

There's a record button in the Coverage tab - the solid filled circle. Allows you to record over multiple pages (either a SPA or normal site).

Re: CSS and JS code coverage in Chrome DevTools

#36
I like this, and it's addictive ;) Any way to automatically generate output that consists of the 100% essential code subset?

As suspected: a typical medium.com page contains approx 75% extra code. Most egregious offenders seem to be content loader scripts like embedly, fonts, unity, youtube, etc.

On the other hand, besides net load performance, I'm not really worrying about the "coverage" metric. Compiling unreal engine via emscripten to build tappy dodo may result in 80%+ unused code, but near native runtime worth is a healthy tradeoff.

Try, for example: http://webassembly.org/demo/

Re: CSS and JS code coverage in Chrome DevTools

#37
post #35

My vague recollection of the Google event where this was first announced (was it late 2016 or early 2017?) - was it was going to "record" your site usage for as long as you were "recording" - and give the report at the end. But this now sounds like a coverage tool for a single page? Does anyone know if it can record over multiple pages and/or application usage (such as an SPA)?

There's a record button in the Coverage tab - the solid filled circle. Allows you to record over multiple pages (either a SPA or normal site).

It looks like it does that. But the results are only for the last page.

I tried it by triggering function A on page 1 and function B on page 2.

The report showed function A as not used.

Re: CSS and JS code coverage in Chrome DevTools

#38

What happened with shipping everything in a single file and letting cache magic happen?

HTTP/2 happened. HTTP/2 allows you to send HTTP requests over a single TCP connection per domain. Headers are compressed. The request overhead is minimal compared to HTTP/1.x. Caching one big file has the draw back of busting the cache each time the file is updated for any small change. Caching multiple small files allows you to have a finer grain cache. Only bust the things that updated. And, since it's all the same…

>HTTP/2 allows you to send HTTP requests over a single TCP connection per domain.

HTTP/1.x definitely has support for this. Not using it actually may get your IP temporarily blocked from many sites.

Post reply on HN