如何优化Flex的布局性能

在Flex单行布局场景下，子组件的主轴尺寸长度和可能存在不等于容器主轴尺寸长度的情况，部分子组件会被布局两次来填充容器，即需要二次布局，导致布局效率下降。如何优化Flex的布局性能

如果使用Flex布局容器，只是为了实现横向或者纵向的布局。那直接使用Row、Column容器反而能够提升渲染性能。关于Flex带来的性能影响可以参考《Flex布局性能提升使用指导》。

在单行布局场景下，子组件的主轴尺寸长度和可能存在不等于容器主轴尺寸长度的情况，部分子组件会被布局两次来填充容器，即需要二次布局，导致布局效率下降。

可以尝试如下方法：

• 使用Column/Row代替Flex。
• 大小不需要变更的子组件主动设置flexShrink属性值为0。
• 优先使用LayoutWeight属性替代flexGrow属性和flexShrink属性。
• 子组件主轴长度分配设置为最常用场景的布局结果，使子组件主轴长度总和等于Flex容器主轴长度。

具体可参考文章《# Flex布局性能提升使用指导》