performance Implement CT.CSS

Harry Roberts (CSS Wizardry) brought out a nifty tool that we recently included into our wp-scaffold at 10up, called ct.css At 10up we included this CSS file behind a query param, such as: ?debug_perf.

The CSS file trawls the <head> showcasing:

Which scripts / css files are render block
Where async / defer attributes are redundant
Other issues that could effect the parsing of HTML on the page.

Demo: https://csswizardry.com/ct/test/ Motivation: https://speakerdeck.com/csswizardry/get-your-head-straight 10up Scaffold Source: https://github.com/10up/wp-scaffold/blob/fc6ed94d596ecf0e4667249263a72b46d7d8fe5b/themes/10up-theme/includes/core.php#L263

Jan 20 '22 13:01 dainemawer

This sounds like a great module to be added via a flag as described here:

https://github.com/WordPress/performance/issues/61#issuecomment-999691430

Or to render any time a constant like WP_PERFORMANCE_DEBUG is set to `true

Jan 20 '22 22:01 mitogh

@dainemawer moved to 'In Review' column and also added the Needs Review label to encourage visibility :)

Feb 03 '22 09:02 eclarke1

Closing per https://github.com/WordPress/performance/pull/148#issuecomment-2093542189:

since the Performance Lab repo intends to incubate plugins for merging into WordPress core, I don't think CT.CSS will be a good fit for the Performance Lab plugin.

Oct 09 '24 16:10 westonruter