[wp-trac] [WordPress Trac] #56990: Render blocking CSS `classic-themes.css` unnecessarily enqueued

[WordPress Trac]

#56990: Render blocking CSS `classic-themes.css` unnecessarily enqueued
-------------------------------------+-------------------------------
 Reporter:  adamsilverstein          |       Owner:  flixos90
     Type:  defect (bug)             |      Status:  assigned
 Priority:  normal                   |   Milestone:  6.2
Component:  Themes                   |     Version:  6.1
 Severity:  normal                   |  Resolution:
 Keywords:  has-patch needs-testing  |     Focuses:  css, performance
-------------------------------------+-------------------------------

Comment (by patrickmeenan):

 As far as I can tell, from the WebPageTest linked tests, inlining the CSS
 increased the HTML size from 5.7K to 5.9K (~200 bytes) and the external
 file was ~200 bytes (both compressed sizes).

 Inlining it will cause it to increase the size of every HTML page and may
 have a bit more overhead on the serving side but I'd expect the actual
 performance impact in either case to be pretty much equivalent (probably
 skewing towards inlined being slightly faster).

 As an external resource, there is some non-zero amount of overhead in
 getting the resource out of cache that is likely much higher than the
 transfer time of the additional 200 bytes in the existing stream. An
 external resource is also more likely to cause delays from scheduling
 contention with other requests depending on how the origin supports
 prioritization.

 My recommendation would be to do what makes the most sense for the
 platform in general and not try to base it on a performance difference.

 If there is not an existing practice of inlining styles then starting to
 do it just for this is probably a bad precedent. If the pattern you'd like
 to encourage is to conditionally add styles to the main styles css then
 it's worth the effort to figure out why that was breaking tests.

 If inlining small styles either in the head or at the first point of use
 is a pattern you want to encourage then it makes sense to do it here.

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