Originally from
From
#3079738-49: Add Claro administration theme to core ā
:
+++ b/core/themes/claro/css/dist/components/action-link.css @@ -0,0 +1,276 @@ + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14px' height='16px' viewBox='0 0 14 16'%3E%3Cpath fill='%23545560' d='M13.9,2.9c-0.1-0.4-0.2-0.6-0.2-0.6c-0.1-0.4-0.4-0.4-0.8-0.5l-2.3-0.3c-0.3,0-0.3,0-0.4-0.3 C9.8,0.5,9.7,0,9.3,0H4.7C4.3,0,4.2,0.5,3.8,1.3C3.7,1.5,3.7,1.5,3.4,1.6L1.1,1.9C0.7,1.9,0.4,2,0.3,2.3c0,0-0.1,0.2-0.2,0.5 C0,3.4-0.1,3.3,0.4,3.3h13.2C14.1,3.3,14,3.4,13.9,2.9z M12.4,4.7H1.6c-0.7,0-0.8,0.1-0.7,0.6l0.8,10.1C1.8,15.9,1.8,16,2.5,16h9.1 c0.6,0,0.7-0.1,0.8-0.6l0.8-10.1C13.2,4.8,13.1,4.7,12.4,4.7z'/%3E%3C/svg%3E");
š¤ Have these SVGs been optimized?
š¤š¤š¤ More importantly: why are these inlined already? (These were done in #3036732: Action link component ā .) I'm sure that the build tools ( #3060153: Use PostCSS in core, initially only for Claro ā ) allow this to happen at build time? That'd make it much easier to inspect the SVGs, to apply SVG optimization tools, to encourage reuse, etc. It also allows us to decide whether we truly want to inline these as
data:
URIs, or whether it makes more sense to let them be loaded by HTTP requests. This particular CSS file is 24 KB ungzipped and unminified. That's ā¦ a lot. Most of that is due to these inlined SVG files (this CSS file is the single largest CSS file in Claro).In other words: for developer ergonomics and for web performance optimization reasons I think we should consider changing this.
In #3083657: Devise strategy to address several SVG loading+usage issues ā , it was agreed this was a sound approach.
Evaluate a build tools that will inline the SVGs from the .pcss.css files when compiled to their .css counterparts.
For each inlined svg either:
For all of them, regardless of the above choice: optimize them. Using for example https://imageoptim.com.
None.
None.
None.
N/A
Fixed
9.1
Not all content is available!
It's likely this issue predates Contrib.social: some issue and comment data are missing.