[webkit-reviews] review granted: [Bug 176289] Web Inspector: Styles Redesign: display @media section headers : [Attachment 320523] Patch

[bugzilla-daemon at webkit.org]

Devin Rousso <webkit at devinrousso.com> has granted Nikita Vasilyev
<nvasilyev at apple.com>'s request for review:
Bug 176289: Web Inspector: Styles Redesign: display @media section headers
https://bugs.webkit.org/show_bug.cgi?id=176289

Attachment 320523: Patch

https://bugs.webkit.org/attachment.cgi?id=320523&action=review




--- Comment #10 from Devin Rousso <webkit at devinrousso.com> ---
Comment on attachment 320523
  --> https://bugs.webkit.org/attachment.cgi?id=320523
Patch

View in context: https://bugs.webkit.org/attachment.cgi?id=320523&action=review

r=me

>>>> Source/WebInspectorUI/ChangeLog:18
>>>> +	      Styles sidebar redesign is to fit more data.
>>> 
>>> This patch means that each rule would list all media queries, meaning that
if every rule has the same query, we're repeating it over and over.  I feel
like that would take up more space than our previous approach.	Do you have any
data as to whether this is true/false?
>> 
>> This patch means that each rule would list all media queries, meaning that
if every rule has the same query, we're repeating it over and over.  I feel
like that would take up more space than our previous approach.	Do you have any
data as to whether this is true/false?
> 
> I haven't done an extensive analysis, but most websites that I've seen have
the majority of their CSS rules without any media queries. Media queries are
mostly used to modify layout for smaller screens and display high resolution
media for retina screen.
> 
> This is what I often see in the current design:
> 
>     Inherited from: body
>     @media screen and (max-width: 600px)
>     body {
>	...
>     }
>     @media all
>     body {
>	...
>     }
> 
> In this example, we have to include `@media all` to explicitly tell that this
rule doesn't share previous rule's media query.
> 
> We wouldn't have to do that if we didn't group media query headers.
> 
> The attached image is from twitter.com.

Ah ok.	I guess for most cases where media queries aren't used its a massive
benefit.