Try out purgeCSS in an attempt to serve a smaller app css bundle. There's a vue-cli plugin for it.
From the docs:
PurgeCSS analyzes your content and your css files. Then it matches the selectors used in your files with the one in your content files. It removes unused selectors from your css, resulting in smaller css files.
| Subject | Repo | Branch | Lines +/- | |
|---|---|---|---|---|
| [DNM] bridge: Add purgeCSS vue cli plugin | mediawiki/extensions/Wikibase | master | +142 -14 |
| Status | Subtype | Assigned | Task | ||
|---|---|---|---|---|---|
| Resolved | None | T253202 dist/ size (both init and app module) | |||
| Resolved | • Tonina_Zhelyazkova_WMDE | T254018 Explore PurgeCSS for our app.css bundle |
Change 599819 had a related patch set uploaded (by Tonina Zhelyazkova; owner: Tonina Zhelyazkova):
[mediawiki/extensions/Wikibase@master] [DNM] bridge: Add purgeCSS vue cli plugin
Current size on master: dist/css/data-bridge.app.css 31.52 KiB gzipped: 4.57 KiB
Size on the related patch: dist/css/data-bridge.app.css 21.88 KiB gzipped: 3.88 KiB
The radio button style looks different from production. My suspicion is something getting purged from normalize.css
Change 599819 abandoned by Tonina Zhelyazkova:
[DNM] bridge: Add purgeCSS vue cli plugin
Reason:
it purges too much and we are out of time to investigate more if this is even useful