面试题：Flutter布局优化之中等难度：嵌套布局的性能问题及优化

Question

在Flutter中，当有多层嵌套的UI组件布局时，可能会出现哪些性能问题？请举例说明，并阐述至少两种针对这些问题的优化方法。

Answer 1

可能出现的性能问题

1. 渲染性能下降：多层嵌套会导致Widget树深度增加，每次状态变化都需要遍历整个树进行重建，例如一个多层嵌套的ListView，每一次更新可能导致大量不必要的Widget重绘。
2. 内存消耗增加：过多的嵌套意味着更多的Widget实例被创建，消耗更多内存，比如多层嵌套的Container组件，每个都占用一定内存。

优化方法

1. 使用 CustomSingleChildLayout 或 CustomMultiChildLayout：对于复杂布局，可以自定义布局逻辑，减少不必要的中间Widget，例如实现一个多层嵌套的卡片布局时，用 CustomSingleChildLayout 可以精准控制布局逻辑，避免多余的Widget创建。
2. 使用 IndexedStack 代替 Stack：如果有多个Widget在同一位置，但只有一个可见，IndexedStack 仅会构建当前可见的Widget，而 Stack 会构建所有子Widget。比如在一个底部导航栏切换页面的场景中，使用 IndexedStack 能减少不必要的Widget构建。