Performance Test Results Cheatsheet

CSS

The scope of these tests is to have a fair comparison of different methods of serving CSS content. The use or absence of third-party CSS libraries, build tools, minification...etc is beyond the scope of these tests.

critical.css (1.4KB): only includes the CSS being used above the fold.
bottom.css (21.4KB): includes the CSS being used below the fold and lots more of unused CSS.
main.css (22.0KB): combines critical.css and bottom.css.

Inline critical CSS
Inline critical CSS and asynchronously load remaining CSS using media="print" trick

Test Results: WPT
Inline critical CSS & preload
Inline critical CSS. preload and asynchronously load remaining CSS using media="print" trick

Test Results: WPT
Inline CSS
Inline all CSS, total document size: 139KB (compressed)

Test Results: WPT
Render-blocking CSS
Connect to external stylesheets in the <head>.

Test Results: WPT
preload to render-blocking CSS
preload to the external stylesheets and load them in the <head>.

Test Results: WPT