Need help on deciding best approach

[BikashRDas]

Hi,
Following is a code snippet. I have mentioned 2 approaches of showing a text field data depending on a property.

Window {
    id: win
    visible: true
    width: 800
    height: 480
    title: qsTr("Hello World")
    property string progressFillType: "TEXT_4"

//Option1
    Text {
        text: progressFillType === "TEXT_1" ? "ABCF" : (progressFillType === "TEXT_2" ? "EFGH" : (progressFillType === "TEXT_3" ? "IJKL" : "MNOP"))
    }


//Option2
//    property var progressFillColorMap : {"TEXT_1" : {color: "ABCF"},
//                                         "TEXT_2" : {color: "EFGH"},
//                                         "TEXT_3" : {color: "IJKL"},
//                                         "TEXT_4" : {color: "MNOP"}
//                                        }
//    Text {
//        text:
//            progressFillColorMap[progressFillType].color
//    }

}

Please let me know which is a better approach, if I am writing for some embedded device?

[Allon]

@BikashRDas Hi,
I do not know about performances but option2 is so much more maintainable and readable that I go for it without any doubt.
Even if option2 would take 10 times more time than option 1, something you have to take in account is how often it is called.
As it displays text I have no doubt that this is not called so often, so I would definitely go for option 2.
Emmanuel

[BikashRDas]

@Allon Hi,
Thank you very much for the reply. I too believe that option 2 is more maintainable and readable. But when I am checking it on the QML Profiler, I am seeing option 2 is holding 1k bytes more than option 1.
A general observation, in majority of the cases option 2 is starting bit faster than option 1 (as observed in QML profiler). But 5% of cases it is reverse. So not able to understand if we can consider the option 2 a bit space consuming but faster way of handing the scenario above or not.

[Allon]

@BikashRDas 1k is not that much even for embedded nowadays. However it seems strange that a map takes some much more space than a conditional evaluation!

[BikashRDas]

Hi @Allon,
The map is actually taking the space, which is around 320 byte. The assignment expression of text value by reading the data from map is actually taking very less space (64 bytes), in comparison to the conditional statement in the option 1 (227 byte).
Yes you are right. 1k is not a big size. And I am sure the map way implementation will definitely help in reducing the number of lines of the JS code (like handlers, functions and conditional checks).

[Allon]

@BikashRDas Speed could depend of how fast the condition is found.
Map will always take the same time as it follows the same logic.
Conditional expression in your case can fail several time before to match the right condition depending of the value to check.
Easy test would be to provide TEXT_4 a lots of time (10000 ?), then TEXT_1. I am quite sure that TEXT_1 would be quicker.

[BikashRDas]

Hi @Allon,
I more question. Having this map implementation in a C++ class and accessing information from the same using Q_INVOKABLE methods, is it a good idea? Or it is better to have the map implementation in the QML context only as mentioned in above example?

[Allon]

@BikashRDas Hi,
Personnally for this case I would keep it in the qml for convenience, or put it in javascript (to make the code more readable).
In the projet we are doing we keep in c++: networking, files managments, Downloadmanager etc. The rest is done in js/qml as it is quicker to write and easier to maintain.