Problem/Motivation
On many of our clients projects we inline critical CSS in order to optimise core web vitals (CWV) such as largest contentful paint (LCP).
We do this by supporting a critical: true
attribute in our theme's libraries.yml file and override the CSS collection renderer service to instead inline the CSS rather than attach it as a link tag.
This is consistent with guidelines on improving LCP
I think there is merit in exploring this as a core feature.
Steps to reproduce
Proposed resolution
Explore the benefits to this approach. There is a downside in terms of caching as this CSS isn't stored/served by CDNs like an external stylesheet. In our client projects it has made a difference
For what it's worth we also defer all non critical CSS using this approach so it would be worth exploring both approaches together.