CSS Loading

Fixes: FCP, LCP, TTI

The CSS is a render-blocking resource, so the key here is to optimize CSS by including critical CSS as an inline style element on the web page, which is needed above the fold. This makes critical CSS a top priority style, and when a page is rendered, these styles get applied to a web page as fast as possible. This is very important for better FCP and showing content to users as quickly as possible.

There are a few things you can do to generate critical CSS, few of which are: 

• Jetpack Boost plugin for WordPress.
• Critical CSS Generator by Addy Osmani
• The Official AMP for WordPress plugin (this uses CSS tree shaking as well to keep CSS under < 75kb for each page)