RepaintBoundary placement for a Flutter list with animated tiles: how many layers is too many
0 reputation · 28 Apr 2025, 01:30 UTC
RepaintBoundary placement for a list with animated tiles
I have a Flutter screen where a mostly static list contains a few tiles that animate frequently (progress indicators and a chart that redraws on new data). The documentation describes RepaintBoundary as a way to isolate a subtree into its own layer so repaints do not propagate to the rest of the tree, which sounds like a fit for these tiles.
What is unclear is the practical limit. The framework docs and performance guidance warn that each boundary allocates its own layer and backing store, so wrapping every item in a long ListView.builder could increase memory usage and raster cost instead of reducing it. I also understand the framework already inserts boundaries in some widgets, so manual ones may be redundant.
Assume a recent stable Flutter 3.x release on Android and iOS. Verification would use the Repaint Rainbow flag and the raster thread timings in DevTools.
My questions:
- Is there a documented heuristic for deciding which subtrees deserve a manual
RepaintBoundary, beyond "frequently changing content next to static content"? - Does wrapping lazily built list items in boundaries interact with item disposal, i.e., are layers freed when off-screen items are unmounted?
- Which DevTools metric best confirms a boundary helped rather than caused layer overhead?