When using ResourceLoaderImageModule, an icon can select which variants or do not apply to it. When using ResourceLoaderOOUIIconPackModule we bloat modules unnecessarily. For example an icon shipped by mobile.editor.images is not used anywhere in the interface (only destructive variant used). Addressing this allows us to reduce bytes on a variety of image modules.
For example here - a module with the following defintion will define rules for .mw-ui-icon-mf-error, .mw-ui-icon-mf-citation-invert and mw-ui-icon-mf-citation but NOT .mw-ui-icon-mf-error-invert
"variants": { "invert": { "color": "#fff" } }, "images": { "citation": { "file": "resources/mobile.startup.images/reference.svg", "variants": [ "invert" ] }, "error": "resources/mobile.startup.images/error.svg",
However in ResourceLoaderOOUIIconPackModule this is not possible - all variants are global.
"variants": { "invert": { "color": "#fff" } }, "icons": [ "citation", "error" ]
I should be able to declare the above ResourceLoaderOOUIIconPackModule like so:
"variants": { "invert": { "color": "#fff" } }, "icons": { "citation": { "variants": [ "invert" ] }, "error": {} }