Compose 階段和效能

Compose 更新影格時,會經歷三個階段:

  • 組合:Compose 會決定要顯示的「內容」。並且會執行可組合函式並建構 UI 樹狀結構。
  • 版面配置:Compose 會決定 UI 樹狀結構中每個元素的大小和位置。
  • 繪圖:Compose 實際上會「算繪」個別 UI 元素。

Compose 可以視需求有意略過任何階段。舉例來說,假設單一圖形元素會在相同大小的兩個圖示之間進行切換。由於這個元素不會改變大小,且不會新增或移除 UI 樹狀結構中的元素,因此 Compose 可以略過組合和版面配置階段,重新繪製這個元素。

不過,程式設計錯誤可能會導致 Compose 難以判斷哪些階段可以安全略過,在這種情況下,Compose 會執行全部三個階段,這可能會拖慢 UI。因此,許多效能最佳做法都是協助 Compose 略過不必要的階段。

詳情請參閱 Jetpack Compose 階段指南。

一般原則

一般來說,改善效能時需遵守以下幾項大原則:

  • 請盡可能將計算結果移出可組合函式。每當 UI 變更時,就可能需要重新執行可組合函式。您放入可組合項中的任何程式碼都會重新執行,可能針對動畫的每個影格重新執行。將可組合項的程式碼限制為建構 UI 所需的程式碼。
  • 盡可能延遲狀態讀取。將狀態讀取移至子項可組合項或後續階段,即可盡量減少重組,或完全略過組合階段。為此,您可以傳遞 lambda 函式 (而不是頻繁變更狀態的狀態值),以及在傳遞頻繁變更的狀態時優先使用 lambda 輔助鍵。您可以在「遵循最佳做法」的「盡可能延遲讀取時間」一節中,查看這項技巧的範例。

其他資源