在應用中渲染動畫是在衡量效能時最常被提及的關注點之一。由於 Flutter 的 Skia 引擎及其快速建立和處置 widget 的能力,Flutter 應用預設情況下效能就很高,因此您只需避免常見的陷阱即可實現出色的效能。

通用建議

#

如果您看到卡頓(不流暢)的動畫,請 **務必** 使用以 *profile* 模式構建的應用來分析效能。預設的 Flutter 構建會建立一個以 *debug* 模式構建的應用,這不能代表釋出時的效能。有關資訊,請參閱 Flutter 的構建模式

幾個常見的陷阱

  • 每一幀都比預期重建了更多的 UI。要跟蹤 widget 的重建,請參閱 顯示效能資料
  • 直接構建大量子項列表,而不是使用 ListView。

有關評估效能的更多資訊,包括常見陷阱的資訊,請參閱以下文件

僅限移動裝置的建議

#

您是否注意到移動應用上的明顯示卡頓,但僅在動畫首次執行時出現?為避免此問題,請確保您使用的是 Flutter 的預設圖形渲染器 Impeller

僅限 Web 的建議

#

以下一系列文章涵蓋了 Flutter Material 團隊在改進 Flutter Gallery 應用在 Web 上的效能時學到的經驗。