Optimized way to colorize SVGs

[TheEnigmist]

Hello,
In terms of performance, what is the best way to colorize total black SVGs inside with QML?
Based on this topic one way is to use MultiEffect.
I have two ways to reach my goal.

1. Load svg file with VectorImage and adding MultiEffect as said in linked topic:

VectorImage{
    fillMode: VectorImage.PreserveAspectFit
    preferredRendererType: VectorImage.CurveRenderer
    source: "qrc:/svg/icon"
    layer.enabled: true
    layer.effect: MultiEffect {
        brightness: 1.0
        colorization: 1.0
        colorizationColor: "red"
    }
}

2. Run svgtoqml tool, create a fillColor property to use in ShapePath.fillColor, use in code:
   Generated code:

Item {
    implicitWidth: 24
    implicitHeight: 24
    property color fillColor: "white"
    component AnimationsInfo : QtObject
    {
        property bool paused: false
        property int loops: 1
        signal restart()
    }
    property AnimationsInfo animations : AnimationsInfo {}
    transform: [
        Translate { x: 0; y: 960 },
        Scale { xScale: width / 960; yScale: height / 960 }
    ]
    id: __qt_toplevel
    Shape {
        preferredRendererType: Shape.CurveRenderer
        id: _qt_node0
        ShapePath {
            id: _qt_shapePath_0
            strokeColor: "transparent"
            fillColor: __qt_toplevel.fillColor
            fillRule: ShapePath.WindingFill
            pathHints: ShapePath.PathQuadratic | ShapePath.PathNonIntersecting | ShapePath.PathNonOverlappingControlPointTriangles
            PathSvg { path: "..." }
        }
    }
}

Used with:

Icon {
    fillColor: "red" 
}

The result is the same. However, which one is better when considering that all the SVG icons are provided at build time and the Qt Quick Compiler flag is set to true in the Qt VS Tools?

[JKSH]

@TheEnigmist said in Optimized way to colorize SVGs:

which one is better

Which metric(s) are most important to you?

• Initialization time?
• CPU load?
• Memory consumption?
• Something else?

Benchmark and compare.

[TheEnigmist]

@JKSH
I think GPU load since MultiEffect uses GPU. I need to run debug bench in VS to check all loads

[GrecKo]

As an alternative, we are using Icons to color svg images meant for button or action icons : https://doc.qt.io/qt-6/qtquickcontrols-icons.html#icon-themes