To improve performance, especially on mobile devices I want to follow Google's suggestion to remove unused CSS styles. The architecture on the site I am working on already loads the CSS based on the components that appears on the page. The next step would be to separate the aggregations into media queries following this article from web.dev:
https://web.dev/articles/critical-rendering-path/render-blocking-css
Ultimately I would like to have something similar to the following result:
One thing I could do is to remove the aggregation and I would be able to add the files. But that completely defeats the purpose as we would lose on performance.
Group the aggregations by media query parameters that are inserted in the libraries.yml file.
Needs work
11.0 🔥
Fixes are made on on 11.x (our main development branch) first, and are then back ported as needed according to our policies. Also, 10.2 is in security mode now.