QML Performance

[SimonJudge]

I have a fairly complex multi-screen QML app that uses Loader to show successive screens. Data is loaded from local files using XMLHttpRequest and also referencing images via "file:xyz.jpg"

The app works ok but loading of screens is slow even if the app is installed to main memory rather than memory card (which is even slower).

I have added some timings to one of the screens to get a feel for what's taking the time. I am mainly using Component.OnCompleted and model start/completion to assess timings.

With the app in main memory (qml files are also stored as resource), it can take about 500ms for the Loader to load a 'next' file and the first OnCompleted (for the outermost item in the next page) to trigger.

The 'next' page has a model that fetches, sorts data in many files and this takes 518ms - to be expected I suppose.

The combination of the Loader time and the model time means the 'next' page is slow to load and looks very untidy until components are loaded. I have tried only settings items visible once data has loaded but this results in a white screen which also isn't that nice.

I can't preload all the screens because they are dynamic and change depending on options in previous screens. Also, preloading all the data would be prohibitive anyway due to the total size being large.

What's the recommended way to hide (transition?), use the Loader differently or something else that allows smooth loading of the 'next' screen?

Thanks

Simon

[mlong]

In a similar situation, I've used two different loaders -- one hidden and one visible. I load my next page on the hidden loader, then (once the hidden item has loaded) flip the visibility flags of the two different loaders. Or, I've used an animation on the opacity values to smoothly dissolve between the two pages.