页面布局写多了很容易堆出一堆无用的容器嵌套影响渲染性能。一、原则在进行页面布局开发时应该尽量减少布局节点避免系统绘制更多的布局组件达到优化渲染性能、减少内存占用的目的。二、使用Builder方法代替自定义组件由于Builder 不涉及生命周期在自定义组件大量嵌套的场景中更加轻量级的 Builder 在性能方面更加出色。建议当自定义组件不涉及到状态变量和自定义生命周期时可以先使用Builder 替换自定义组件提升性能。三、合理使用布局容器组件进行 UI 布局时子组件根据父组件的布局算法排列然后按规则摆放位置。不同的布局容器对性能的影响不同。建议根据场景选择合适的布局除非必要尽量避免使用性能差的布局组件复杂布局提供场景化能力解决多种布局场景问题不当使用高级组件可能增加性能消耗四、布局优化在进行 UI 布局时额外的节点数会导致更多计算影响性能。主要优化方式如下优化方式说明1. 移除冗余节点、使用扁平化布局减少节点数2. 减少自定义组件产生多余节点自定义组件自身为非渲染节点仅是组件树和状态数据的组合常规使用自定义组件时并不会产生多余的节点。但是给自定义组件添加属性后会将自定义组件作为一个整体节点进行处理需通过优化手段减少多余节点3. 删除无用的 Stack/Column/Row 嵌套在组件嵌套的情况中可以找到一些无用的容器组件嵌套移除冗余节点从而避免冗余节点对性能的消耗4. 直接使用组件属性或系统 API 能力有些场景直接使用组件属性或借助系统 API 即可实现例如• 使用overlay属性实现浮层场景• 使用ColorMetrics实现颜色叠加效果说明节点越少渲染越快额外的节点数会导致更多计算影响性能。这是所有优化的出发点。Builder 是轻量级组件不涉及生命周期在大量嵌套场景下性能优于自定义组件。判断标准很简单——不涉及状态变量和自定义生命周期就用 Builder。自定义组件加属性会变成整体节点这是个容易忽略的点。自定义组件本身不是渲染节点但给它加属性后就会被当成一个整体节点处理产生额外开销。优化时要留意。容器嵌套是无用节点的重灾区无用的 Stack/Column/Row 嵌套很常见比如外层 Column 里只有一个 RowRow 里只有一个 Text这种嵌套完全可以拍平。布局容器选型影响性能不同容器的布局算法不同性能开销也不同。除非必要别用性能差的布局组件按场景选最合适的。能用属性/API 就别堆容器比如overlay属性→ 实现浮层不用额外叠一层容器ColorMetrics→ 实现颜色叠加不用叠多层带背景色的容器扁平化布局是核心思路能用一层解决的别用两层能用属性解决的别用容器减少层级就是减少计算。高级组件要慎用比如说不当使用高级组件可能增加性能消耗高级组件能力强但开销大场景不匹配时反而拖累性能。优化要有度量结合 DevEco Studio 能力可以配合布局检查器查看节点树定位冗余节点后再优化。