Qt Forum

    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search
    • Unsolved

    Unsolved Why is QML Image taking up so much memory? Slowing down application

    QML and Qt Quick
    3
    8
    688
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • Edwin F.
      Edwin F. last edited by

      My Qt Quick application is slowing down and consuming way too much memory when I load Images. I am loading around 5 PNG images that are large, about 50MB each.

      See the size here:
      0_1565205188580_Screen Shot 2019-08-07 at 3.04.33 PM.png

      Before loading the Images the memory consumption of the app is about 300MB, not too bad...Then when I load the 5 Images it jumps to 4.4 GB and stays there! ( I tried calling gc() on completed, it did nothing)

      So I did some experiments. I wrote this basic application, just a QML Image. I executed without an image source, and the memory was 28.7 MB, This is a screen capture from Mac's 'Activity Monitor'

      import QtQuick 2.12
      import QtQuick.Controls 2.3
      
      Image {
          id: imageId
          anchors.fill: parent
          fillMode: Image.PreserveAspectFit
          anchors.centerIn: parent
          //source: 'test_images/1.png'
      }
      
      

      0_1565205055789_Screen Shot 2019-08-07 at 3.04.12 PM.png

      When I added the 50MB image as the source the memory consumption jumped to 1.39GB and stayed there! Even after gc() which did nothing...

      import QtQuick 2.12
      import QtQuick.Controls 2.3
      
      Image {
          id: imageId
          anchors.fill: parent
          fillMode: Image.PreserveAspectFit
          anchors.centerIn: parent
          source: 'test_images/1.png'
      }
      

      0_1565205168884_Screen Shot 2019-08-07 at 3.03.45 PM.png

      What is happening to this Image object to make it consume 1.39GB of memory! The image is only 50MB! This is the root of my problems with my app and it is making my application almost unusable. This is a major problem for the QtQuick platform. Any comments or suggestions on how to resolve this? Thanks!

      1 Reply Last reply Reply Quote 0
      • SGaist
        SGaist Lifetime Qt Champion last edited by

        Hi,

        What version of Qt are you using ?
        What size are your png ?

        You do realize that the png format is compressed and that to show it on screen, it must be uncompressed and changed to something that can be shown on screen like for example RGBA ?

        Interested in AI ? www.idiap.ch
        Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

        1 Reply Last reply Reply Quote 0
        • Edwin F.
          Edwin F. last edited by Edwin F.

          I am using QT 5.12

          As shown in the attachment my image is only 51.9MB.

          Using Mac's default image viewer 'Preview' the memory for opening this same image is 400MB.

          0_1565206468404_Screen Shot 2019-08-07 at 3.32.24 PM.png

          This QML Image as take up more than 3 times that. What is happening?

          1 Reply Last reply Reply Quote 0
          • SGaist
            SGaist Lifetime Qt Champion last edited by

            I meant width/height.

            Interested in AI ? www.idiap.ch
            Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

            1 Reply Last reply Reply Quote 0
            • IntruderExcluder
              IntruderExcluder last edited by IntruderExcluder

              Can you add sourceSize: {width: width; height: height} to your image? Just post results.

              1 Reply Last reply Reply Quote 1
              • Edwin F.
                Edwin F. last edited by Edwin F.

                Thanks for the feedback guys,

                @SGaist
                The width height of the actual image is:
                width = 11000
                height = 11000

                @IntruderExcluder
                I tried what you suggested and set the sourceSize to the width/height of the image like so

                import QtQuick 2.12
                import QtQuick.Controls 2.3
                
                Image {
                    id: imageId
                    anchors.fill: parent
                    fillMode: Image.PreserveAspectFit
                    anchors.centerIn: parent
                    source: 'test_images/1.png'
                    sourceSize: Qt.size(imageId.width, imageId.height)
                
                    Component.onCompleted: {
                        console.log('width: ' + width)
                        console.log('height: ' + height)
                        console.log(imageId.sourceSize.width)
                        console.log(imageId.sourceSize.height)
                    }
                }
                

                Terminal Output:

                ...
                qml: width: 11000
                qml: height: 11000
                qml: 11000
                qml: 11000
                

                Now after adding that sourceSize line the memory usage is down from 1.38GB to 30.9MB ! What kind of sorcery magic is happening here? Is this because without setting sourceSize the maximum possible image space is used in memory? However although the memory usage is drastically lower, the responsiveness seems to decrease, it becomes more 'choppy'/'glitchy' when resizing the window. Whereas before, without setting sourceSize the resizing happens very smoothly, probably because the ENTIRE image, with all 11000x11000 pixels are already loaded in memory?

                Thanks!

                0_1565271161791_Screen Shot 2019-08-08 at 9.29.09 AM.png

                1 Reply Last reply Reply Quote 0
                • IntruderExcluder
                  IntruderExcluder last edited by

                  @edwin-f said in Why is QML Image taking up so much memory? Slowing down application:

                  Is this because without setting sourceSize the maximum possible image space is used in memory?

                  Sort of, but I still dunno why Qt takes so much memory. Was it debug or release version of app?

                  @edwin-f said in Why is QML Image taking up so much memory? Slowing down application:

                  However although the memory usage is drastically lower, the responsiveness seems to decrease, it becomes more 'choppy'/'glitchy' when resizing the window.

                  This is because everytime window size changed image should be rescaled from its source. You should use some delayed rescaling, or maybe use Qt.callLater.

                  1 Reply Last reply Reply Quote 0
                  • Edwin F.
                    Edwin F. last edited by

                    Thanks for the suggestion I'll look into the Qt.callLater

                    Right now there is no concept of debug vs. release mode because I am not compiling. I am using Python backend with QML frontend and PySide 2 for the communication between the two

                    1 Reply Last reply Reply Quote 0
                    • First post
                      Last post