Hi,

I have a complex layout with several QML pages using Qt Components on Symbian^3. To speed up loading of the QML, I load pages dynamically when they are required:
Code:
Window {
	id: mainWindow
	property Component page1
	property Component page2
	property Component page3

	PageStack {
        id: pageStack
        anchors { left: parent.left; right: parent.right; top: parent.top; bottom: parent.bottom }
    }

	function pushPage(page,url) {
		if (!page) {
			console.log("loading: " + url);
			page = Qt.createComponent(Qt.resolvedUrl(url));
		}

		if (pageStack.currentPage != page) {
			pageStack.replace(page); // Slow!!!
		}
		return page;
	}

    Component.onCompleted: {
        page1 = Qt.createComponent(Qt.resolvedUrl("Page1.qml"));
        pageStack.push(page1);
    }

	ToolBar {
        id: mainToolBar
        visible: true
        tools: mainToolBarContainer
    }

	ToolBarLayout {
        id: mainToolBarContainer

		ToolButton {
			iconSource: "qrc:/page1.png"
			onClicked: {
				page1 = mainWindow.pushPage(page1,"Page1.qml");
			}
		}

		ToolButton {
			iconSource: "qrc:/page2.png"
			onClicked: {
				page2 = mainWindow.pushPage(page2,"Page2.qml");
			}
		}

		ToolButton {
			iconSource: "qrc:/page3.png"
			onClicked: {
				page3 = mainWindow.pushPage(page3,"Page3.qml");
			}
		}
	}
}
But the loading of pages (e.g. 'page3 = mainToolBar.pushPage(page3,"Page3.qml");'), even after loading the page (e.g. the component is created and is not needed to be loaded again) is much slower than loading the pages this way (which is no option because the QML loading of all pages at once takes too long):
Code:
Window {
	id: mainWindow

	PageStack {
        id: pageStack
        anchors { left: parent.left; right: parent.right; top: parent.top; bottom: parent.bottom }
    }

	Page {
		id: page1
		// Qt Components are here
	}
	Page {
		id: page2
		// Qt Components are here
	}
	Page {
		id: page3
		// Qt Components are here
	}

    Component.onCompleted: {
        pageStack.push(page1);
    }

	ToolBar {
        id: mainToolBar
        visible: true
        tools: mainToolBarContainer
    }

	ToolBarLayout {
        id: mainToolBarContainer

		ToolButton {
			iconSource: "qrc:/page1.png"
			onClicked: {
				if (pageStack.currentPage != page1) {
					pageStack.replace(page1); //fast
			}
		}

		ToolButton {
			iconSource: "qrc:/page2.png"
			onClicked: {
				if (pageStack.currentPage != page2) {
					pageStack.replace(page2); //fast
			}
		}

		ToolButton {
			iconSource: "qrc:/page3.png"
			onClicked: {
				if (pageStack.currentPage != page3) {
					pageStack.replace(page3);  //fast
			}
		}
	}
}
What's causing the performance difference? How can I fix the performance of the dynamic loading code?

Regards,