misc(treemap): shade background for unused bytes

[paulirish]

proposing this alternative UX for 'Unused Bytes' mode.

https://lighthouse-git-treemap-unusedhue-googlechrome.vercel.app/gh-pages/treemap/?debug and click 'unused bytes'

compared to

https://lighthouse-git-master-googlechrome.vercel.app/gh-pages/treemap/?debug

[connorjclark]

I think it's too busy... prefer this:

also concerned how user would know which shade is unsued vs used

also concerned that we'd have two different ways to visualizing coverage.

would like to see: only highlighed nodes (the most egregious unused nodes) getting a special treatment; and that treatment being the same thing used in the coverage table column

[adamraine]

also concerned how user would know which shade is unsued vs used

I agree, couldn't tell which shade represents "used" at first glance.

[paulirish]

too busy

yes. it's def busy.

i prefer this:

yeah the thing i don't like about that is the arbitrary thresholds. I think there are likely still modules of interest that are slightly below those numbers. it's hard to hit a binary threshold right so i want to make it a continuous thing.

I agree, couldn't tell which shade represents "used" at first glance.

yeah totally fair. i'm gonna try a candystripe shading to see if it helps.

[connorjclark]

+1 to the new changes Paul demoed in today's meeting.

[connorjclark]

magic? magic. ok.