doc/src/qtquick1/qdeclarativeperformance.qdoc

   1 /****************************************************************************
   2 **
   3 ** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
   4 ** Contact: http://www.qt-project.org/
   5 **
   6 ** This file is part of the documentation of the Qt Toolkit.
   7 **
   8 ** $QT_BEGIN_LICENSE:FDL$
   9 ** GNU Free Documentation License
  10 ** Alternatively, this file may be used under the terms of the GNU Free
  11 ** Documentation License version 1.3 as published by the Free Software
  12 ** Foundation and appearing in the file included in the packaging of
  13 ** this file.
  14 **
  15 ** Other Usage
  16 ** Alternatively, this file may be used in accordance with the terms
  17 ** and conditions contained in a signed written agreement between you
  18 ** and Nokia.
  19 **
  20 **
  21 **
  22 **
  23 **
  24 ** $QT_END_LICENSE$
  25 **
  26 ****************************************************************************/
  27
  28 /*!
  29 \page qdeclarativeperformance.html
  30 \inqmlmodule QtQuick 1
  31 \title QML Performance - Qt Quick 1
  32
  33 \section1 Opaque Items
  34
  35 Items hidden behind an opaque item incur a cost.  If an item will be enitrely
  36 obscured by an opaque item, set its opacity to 0.  One common example of
  37 this is when a "details" page is shown over the main application view.
  38
  39 \section1 Clipping
  40
  41 \e clip is set to false by default.  Enable clipping only when necessary.
  42
  43 \section1 Anchors vs. Binding
  44
  45 It is more efficient to use anchors rather than bindings to position items
  46 relative to each other.  Consider this use of bindings to position rect2
  47 relative to rect1:
  48
  49 \code
  50 Rectangle {
  51     id: rect1
  52     x: 20
  53     width: 200; height: 200
  54 }
  55 Rectangle {
  56     id: rect2
  57     x: rect1.x
  58     y: rect1.y + rect1.height
  59     width: rect1.width - 20
  60     height: 200
  61 }
  62 \endcode
  63
  64 This is achieved more efficiently using anchors:
  65
  66 \code
  67 Rectangle {
  68     id: rect1
  69     x: 20
  70     width: 200; height: 200
  71 }
  72 Rectangle {
  73     id: rect2
  74     height: 200
  75     anchors.left: rect1.left
  76     anchors.top: rect1.bottom
  77     anchors.right: rect1.right
  78     anchors.rightMargin: 20
  79 }
  80 \endcode
  81
  82 \section1 Images
  83
  84 Images consume a great deal of memory and may also be costly to load.  In order
  85 to deal with large images efficiently it is recommended that the Image::sourceSize
  86 property be set to a size no greater than that necessary to render it.  Beware that
  87 changing the sourceSize will cause the image to be reloaded.
  88
  89 Images on the local filesystem are usually loaded synchronously.  This is usually
  90 the desired behavior for user interface elements, however for large images that
  91 do not necessarily need to be visible immediately, set the Image::asynchronous
  92 property to true.  This will load the image in a low priority thread.
  93
  94 \section1 View Delegates
  95
  96 Delegates must be created quickly as the view is flicked.  There are two important
  97 aspects to maintaining a smooth view:
  98
  99 \list
 100 \o Small delegates - keep the amount of QML to a minimum.  Have just enough
 101 QML in the delegate to display the necessary information.  Any additional functionality
 102 that is only needed when the delegate is clicked, for example, should be created by
 103 a Loader as needed.
 104 \o Fast data access - ensure the data model is as fast as possible.
 105 \endlist
 106
 107 \section1 Image resources over composition
 108
 109 If possible, provide a single image resource, rather than using composition
 110 of a number of elements.  For example, a frame with a shadow could be created using
 111 a Rectangle placed over an Image providing the shadow.  It is more efficient to
 112 provide an image that includes the frame and the shadow.
 113
 114 \section1 Limit JavaScript
 115
 116 Avoid running JavaScript during animation.  For example, running a complex
 117 JavaScript expression for each frame of an x property animation.
 118
 119 \section1 Rendering
 120
 121 Often using a different graphics system will give superior performance to the native
 122 graphics system (this is especially the case on X11). This can be configured using
 123 QApplication::setGraphicsSystem() or via the command line using the \c -graphicssystem
 124 switch.
 125
 126 You can enable OpenGL acceleration using the \c opengl graphics system, or by setting a
 127 QGLWidget as the viewport of your QDeclarativeView.
 128
 129 You may need to try various options to find what works the best for your application.
 130 For embedded X11-based devices one recommended combination is to use the raster graphics
 131 system with a QGLWidget for the viewport. While this doesn't guarantee the \bold fastest
 132 performance for all use-cases, it typically has \bold{consistently good} performance for
 133 all use-cases. In contrast, only using the raster paint engine may result in very good
 134 performance for parts of your application and very poor performance elsewhere.
 135
 136 The QML Viewer uses the raster graphics system by default for X11 and OS X. It also
 137 includes a \c -opengl command line option which sets a QGLWidget as the viewport of the
 138 view. On OS X, a QGLWidget is always used.
 139
 140 You can also prevent QDeclarativeView from painting its window background if
 141 you will provide the background of your application using QML, e.g.
 142
 143 \code
 144 QDeclarativeView window;
 145 window.setAttribute(Qt::WA_OpaquePaintEvent);
 146 window.setAttribute(Qt::WA_NoSystemBackground);
 147 window.viewport()->setAttribute(Qt::WA_OpaquePaintEvent);
 148 window.viewport()->setAttribute(Qt::WA_NoSystemBackground);
 149 \endcode
 150
 151 */