20200311-01 QML 提升性能的小技巧

冷不防 2023-07-13 08:20 19阅读 0赞

[QT 官方原文][QT]

## 一、归纳核心如下 ##

1.  尽量少的使用 Javascript 在 QML 之中
2.  不要使用太复杂的 QML 层次和结构，确保代码的简洁高效
3.  避免在一个 window UI 中使用多个 View
4.  避免计算，包括透明度，等比例缩放等等，能使用图片使用图片代替
5.  避免使用 QDebug 等调试输出
6.  C++ 的类型与 QML 通过 Q\_PROPERTY 转换的时候，尽量避免使用 QList, QMap 这类容器，程序需要进行大量转换才能得到 Javascript 接受的 array 数据结构
7.  尽量使用低成本转换的 int,qreal,QString,int,QUrl,bool 数据类型
8.  Image 的 sourcesize 是决定其在内容的存储大小，如果与实际使用不符合就会等比例缩放
9.  需要进行大量计算时，使用异步/低级线程/缓存等空间换时间的方式，提升界面流畅度
10. 懒汉规则：  
    1）启用 asynchronous = true  
    2) 避免使用 clipping 属性
11. Loader 或则 javascript 动态加载
12. 当一个对象被完全覆盖的时候，使用 visible = false 来避免资源的消耗
13. 减少动画面积
14. 尽量使用 C++ 提升效率

Loader
    1 不需要使用的时候， active = false
    2 启用 asynchronous
    3 source / sourceComponent = undefined 就可以释放掉原先对象
    
    赋值的两种方式
    方式一：针对 component 
    Component {
        id: tt
        Text {
        }
    }
    Loader {
        id: loader
        sourceComponent: tt
        onStatusChanged: {
            if (loader.status === Loader.Ready) {
                load.item.text = "xxxx"
            }
        }
    }
    
    方式二：针对 QML 文件
    Loader {
        id: loader
        Component.onCompleted: {
            loader.setSource("TestT.qml", {"text":"xx123"});
        }
    }

[QT]: https://doc.qt.io/qt-5/qtquick-performance.html#javascript-code