在QML應用開發過程中，可以使用QML Profiler來查找應用程序中典型性能問題的原因，例如啟動慢、響應慢、用戶界面不流暢等。

本文主要以QML Profiler工具本身出發，描述如何使用QML Profiler來分析QML應用，記錄其常規使用方法。

設置QML Profiler

在QtCreator中，依次打開編輯->Preferences->分析器->QML Profiler：

可以選中“Flush data while profiling”復選框，用于在分析停止時定期刷新數據，這將節省目標設備上的內存，縮短了停止分析和顯示數據之間的等待時間。

在“Flush interval”字段中，以毫秒為單位設置刷新間隔。間隔時間越短，刷新數據的頻率就越高。間隔越長，目標應用程序中需要緩沖的數據就越多，可能會浪費內存。但是，刷新本身是需要時間的，這可能會影響分析結果的顯示。

如果有多個QML引擎，并且希望將所有引擎產生的數據聚合到一個跟蹤視圖中，那么就選中“ Process data only when process ends”復選框。如果不選中，當一個引擎停止時，分析就停止了。

注：在QtCreator中，一般不用設置QML Profiler，我們直接使用就可以了

使用QML Profiler

在QtCreator中使用QML Profiler分析應用軟件，按照以下步驟即可：在已經創建了一個項目工程的前提下，依次點擊Analyze -> QML Profiler：

然后會自動編譯運行對應的項目工程，QML Profiler在我們的應用軟件運行過程中，會出現下圖所示的類似信息：

（當程序開始運行后，會自動進行時間計數。如果有輸入事件，還會顯示對應的事件捕獲信息）

分析收集的數據

在QML應用程序退出后，則會在QML Profiler視圖中自動顯示數據，如下圖所示：

上圖中，水平為時間軸，該時間軸是監聽QML應用軟件開始到結束的時間。上方有對應的時刻顯示；中間位置則是統計的數據，我們可以用鼠標點擊對應的數據區塊（可以在信息顯示欄中看到對應時間內區塊的數據情況）。左側是事件分類，事件在時間軸視圖的以一行或多行顯示。可用的事件類型取決于應用程序編譯時所使用的Qt版本以及使用的Qt Quick版本。在顯示數據時，有如下表所示的事件分類：

注：由于QML應用程序在啟動創建過程中，組件的創建時間極短（一般都是在微秒級別），然而在時間線視圖中所呈現的是所有監聽時間內的數據，如下圖所示：

所以需要縮小時間軸（按住Ctrl，向上滾動鼠標中鍵或者用鼠標拖動時間軸）去查看組件創建相關的數據信息。例如下圖所示：

（由上圖可見，大約需要2.41ms創建完QML的小組件）

從Flame Graph視圖分析數據

『Flame Graph』視圖顯示了關于QML和JavaScript執行情況的更簡明的統計信息。在Total Time視圖中，水平條顯示了相對于所有JavaScript和QML事件的總的運行時間，還顯示調用某個函數所花費的總時間，而且嵌套顯示了函數調用情況。

在下拉菜單中選擇Memory，可以查看各函數分配的內存總量

如果要查看函數分配的內存數量，就需要選中下拉菜單中的Allocations一欄。如下圖所示：

（這張圖可以“從下往上”看，越往上就是QML中的最小元素了。點擊視圖中的某一項同時會跳轉到在代碼中的對應行上。）

注：使用鼠標左鍵雙擊視圖中的項目可以放大對應視圖。雙擊視圖中的空白區域可以再次縮小。

與『Timeline』視圖不同，在沒有QML或JavaScript運行的時候，『Flame Graph』視圖不顯示時間跨度，因此，『Flame Graph』不適合分析QML應用中每幀的執行時間（『Timeline』視圖更適合）。但是，該視圖可以很清晰的看到在QML應用程序運行過程中，各種QML和JavaScript事件的總體情況。

從Statistics視圖分析數據

『Statistics』視圖顯示了QML應用中binding、create、compile、JavaScript或信號事件被觸發的次數，以及花費的平均時間，如下圖所示：



這可以讓我們檢查需要優化的事件，如果某事件大量出現可能表明觸發了不必要的事件。要查看事件發生的中位數、最長時間和最短時間，可以在上下文菜單中選擇擴展事件統計。

接著數據顯示將如下圖所示：

Caller和Callee一欄顯示了事件之間的依賴關系，用于檢查應用程序的內部功能。Caller一欄表示觸發綁定的QML事件，通過Caller我們可以知道是什么觸發了綁定中的更改。Callee表示綁定觸發的QML事件，從Callee我們可以知道如果更改綁定，哪些QML事件將會受到影響。

結尾

在QML應用程序中，出現啟動慢、響應慢、用戶界面不流暢等性能方面的問題時。典型的原因可能是：在太少的幀中執行了太多的JavaScript。這意味著所有的JavaScript都必須在GUI線程繼續運行之前返回（執行完成）。

導致類似性能問題的另一個典型原因是：創建、繪制或更新了不可見項，該操作在GUI線程中需要花費許多的時間。

在QML Profiler分析視圖中，為了發現過度使用JavaScript，應檢查Animations和Scene Graph事件中的幀率，尋找間隙，并檢查應用程序是否如預期的那樣運行。對于JavaScript類別顯示函數的運行時間，應該盡量將其控制在每幀16毫秒以下（注：官方文檔給出的參數）。

要發現如果是不可見項引起的性能問題，需要查找丟失的幀，并檢查是否在應用程序代碼中使用了太多的短綁定或每幀都要更新的信號處理程序。除此之外，我們還可以可視化場景圖，并找到不可見的項目，因為這些項目往往位于屏幕外或隱藏在其他可見元素之下，稍不留神就溜了。

本文主要描述了如何使用QML Profiler來分析應用程序，更多的內容是從工具本身出發的。如果后續遇著QML應用軟件設計上的嚴重性能問題時，在寫寫啦。

審核編輯：劉清