[wp-trac] [WordPress Trac] #49638: Determine methodology recommendations for CSS audit

[WordPress Trac]

#49638: Determine methodology recommendations for CSS audit
------------------------------+------------------------------
 Reporter:  notlaura          |       Owner:  (none)
     Type:  enhancement       |      Status:  new
 Priority:  normal            |   Milestone:  Awaiting Review
Component:  Build/Test Tools  |     Version:
 Severity:  normal            |  Resolution:
 Keywords:                    |     Focuses:  css
------------------------------+------------------------------

Comment (by notlaura):

 Had a quick win using a stylesheet analysis tool called Parker:
 [https://github.com/katiefenn/parker].

 Here are the stats running it on wp-admin/css.

 {{{

 Total Stylesheets: 26
 Total Stylesheet Size: 496851
 Total Rules: 4353
 Total Selectors: 6261
 Total Identifiers: 17062
 Total Declarations: 10111
 Selectors Per Rule: 1.4383184011026877
 Identifiers Per Selector: 2.7572272799872226
 Specificity Per Selector: 54.01708992173774
 Top Selector Specificity: 401
 Top Selector Specificity Selector: #side-sortables #postcustom
 #postcustomstuff #the-list textarea
 Total Id Selectors: 2178
 Total Unique Colors: 133
 Unique Colors:
 #F7F7F7,#CCCCCC,#555555,#FAFAFA,#999999,#23282D,#A0A5AA,#5B9DD9,#DDDDDD,#72777C,#FFEBE8,#CC0000,#000000,#FFF8E5,#FFB900,#F6A306,#FBEAEA,#DC3232,#666666,#F1F1F1,#FFFFFF,#444444,#0073AA,#00A0D2,#124964,#32373C,#016087,#F9F9F9,#5A5A5A,#46B450,#007CBA,#CCD0D4,#555D66,#FBFBFB,#E2E4E7,#ADC5D2,#191E23,#6C7781,#40860A,#F8F9F9,#BFE7F3,#826EB4,#EEEEEE,#F3F3F5,#E8E8E8,#9FD0D5,#298CBA,#FFFFE0,#D54E21,#FFE9E9,#FFAAAA,#E9FFE9,#AAFFAA,#82878C,#B4B9BE,#00B9EB,#CA4A1F,#AAAAAA,#F4EFE1,#D7D2C5,#413E38,#FEFCF7,#716D64,#BD3854,#5F1B29,#321017,#F5F5F5,#F6C9CC,#F1ACB1,#FF6666,#606A73,#FEF7F1,#AC1B1B,#E29808,#EDC048,#CD5A5A,#F6E2AC,#DF3232,#AA0000,#727773,#FCFCFC,#83B4D8,#DD3D36,#1E8CBE,#C4C4C4,#F3F3F3,#0074A2,#EDEFF0,#FBFBFC,#E5E5E5,#FDFDFD,#E3E3E3,#7E8993,#F1ADAD,#E35B5B,#FBC5A9,#F78B53,#FFE399,#FFC733,#C1E1B9,#83C373,#888888,#F7FCFE,#D64D21,#F56E28,#79BA49,#006505,#D98500,#E4F2FD,#727272,#E1E1E1,#C62D2D,#31843F,#FF8573,#FAAFAA,#FECAC2,#BB2A2A,#D5D2CA,#656A6F,#EAEAEA,#0071A1,#F3F5F6,#CCF3FA,#9999DD,#ECF7
 ED,#E5F5FA,#FFBA00,#66C6E4,#F6FBFD,#222222,#33B3DB,#D5D5D5,#929793
 Total Important Keywords: 110
 Total Media Queries: 69
 Media Queries: screen and (max-width: 782px),only screen and (max-width:
 799px),print,(-webkit-min-device-pixel-ratio: 1.25),(min-resolution:
 120dpi),screen and (max-height: 550px),all and (min-width: 784px),only
 screen and (max-width: 1004px),screen and (max-height: 700px) and (min-
 width: 981px),only screen and (max-width: 960px),screen and (max-width:
 600px),screen and (max-width: 480px),only screen and (max-width:
 500px),only screen and (max-width: 480px),only screen and (min-width:
 769px) and (max-width: 1000px),only screen and (max-width: 768px),only
 screen and (min-width: 800px) and (max-width: 1499px),only screen and
 (min-width: 1500px) and (max-width: 1800px),screen and (max-width:
 870px),screen and (min-width: 355px),screen and (max-width: 640px),screen
 and (max-width: 660px),only screen and (max-width: 1120px),only screen and
 (max-width: 782px),only screen and (max-width: 600px),only screen and
 (max-width: 640px),screen and (max-height: 400px),screen and (max-width:
 320px),only screen and (min-width: 1250px),only screen and (max-width:
 850px),only screen and (max-height: 480px),screen and (max-width:
 450px),only screen and (max-width: 320px),screen and (min-width: 1600px)
 and ( max-width: 2299px ),screen and (min-width: 2300px),screen and (max-
 width: 1100px) and (min-width: 782px),(max-width: 480px),only screen and
 (min-width: 2000px),only screen and (min-width: 1680px),only screen and
 (min-width: 1640px),only screen and (max-width: 780px),only screen and
 (max-width: 650px),screen and (min-width: 1667px),screen and (min-width:
 3333px),screen and (max-width: 1024px),aural,only screen and (max-width:
 1000px),screen and (max-width: 771px),screen and (max-width: 830px),only
 screen and (max-width: 599px),only screen and (min-width: 600px),only
 screen and (min-width: 600px) and (max-width: 699px),only screen and (min-
 width: 700px) and (max-width: 1199px),only screen and (min-width: 1200px)
 and (max-width: 1399px),only screen and (min-width: 1400px) and (max-
 width: 1599px),only screen and (min-width: 1600px),screen and (min-width:
 1670px),screen and (min-width: 2101px),screen and (min-width: 1601px) and
 (max-width: 2100px),screen and (min-width: 1201px) and (max-width:
 1600px),screen and (min-width: 851px) and (max-width: 1200px),screen and
 (max-width: 850px),screen and (max-height: 540px),screen and (max-width:
 1018px),screen and (max-width: 900px),screen and (max-width: 792px),(max-
 width: 850px),(max-height: 472px),screen and (max-width: 1200px)

 }}}

 A couple of these are listed in ticket #49637 as items in the report
 outline!

-- 
Ticket URL: <https://core.trac.wordpress.org/ticket/49638#comment:6>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform