dartpad

“ 本文是 Flutter 性能优化系列文章之一，记录了 Flutter 团队优化 Flutter Gallery 的实践。本文主要介绍了如何打造高性能的 widget。原文链接：https://medium.com/flutter/building-performant-flutter-widgets-3b2558aa08fa ” 所有无状态和有状态 widget 都会实现 build() 方法，这个方法决定了它们是如何渲染的。app 中的一屏就可能有成百上千个部件，这些部件可能只会构建一次，或者在有动画或者某种特定的交互情况下，也有可能构建多次。如果想构建快速的 widget，你一定要很谨慎地选择构建哪些 widget，以及在什么时候构建。 这篇文章主要讨论只构建必要的和只在必要时构建，然后会分享我们是如何使用这个办法来显著提高 Flutter Gallery 的性能。我们还会分享一些高级技巧用于诊断你的 web app 中类似的问题。 只在必要时构建 — 一个重要的优化方法是，只在绝对必要时才构建 widget。 谨慎地调用 setState() 调用 setState 方法会引起 build() 方法调用。如果调用太多次，会使性能变慢。 看一下下面的动画，显示在前面的黑色 widget 向下滑动，露出后面类似棋盘的面板，类似于 bottom sheet [1] 的行为