Flex中添加大量组件时内存占用问题

╰半橙微兮° 2022-08-08 14:54 150阅读 0赞

前期在使用FLEX做一个设计器时考虑到了内存和效率问题，由于前期考虑到用户交互，还是使用了Group代替了Sprite作为设计器中组建的跟节点，但设计的图纸越来越大的时候，内存占用和效率的问题越来越突出，近来，一直想改造一下，所以做了一个实验，发现使用Spite和Group的区别有这么的大。

下面是实验对比结果：（ThinkPad T410i）

<table> 
 <thead> 
  <tr> 
   <th>组件节点根对象</th> 
   <th align="right">节点数量</th> 
   <th align="right">内存占用（MB）</th> 
   <th align="right">创建时间（毫秒）</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>Group</td> 
   <td align="right">100</td> 
   <td align="right">2.7</td> 
   <td align="right">496</td> 
  </tr> 
  <tr> 
   <td></td> 
   <td align="right">10000</td> 
   <td align="right">105</td> 
   <td align="right">61955</td> 
  </tr> 
  <tr> 
   <td>Sprite</td> 
   <td align="right">100</td> 
   <td align="right">2</td> 
   <td align="right">206</td> 
  </tr> 
  <tr> 
   <td></td> 
   <td align="right">10000</td> 
   <td align="right">35</td> 
   <td align="right">10198</td> 
  </tr> 
 </tbody> 
</table>

可以很容易看出，使用Group的内存占用快要达到**3倍**，创建时间有**6倍**。

需要解释的是一个Sprite组建不能直接添加到Flex的组建中，需要包一个UIComponent,如果使用Sprite时，所有组建都可以添加到一个UIComponent中，而是用Group时，每一个组件都需要使用一个UIComponent包起来，才可以添加。组建的绘制在Sprite上执行。

**结论：如果需要大量组件的创建，请使用Sprite作为组件的根节点，并把所有的组建通过一个UIComponent包起来，这样在内存占用和创建时间就可以优化很多，尤其是组建数量很多时。不过，如果你的组建数目超过1万个时，需要考虑其他优化方法，不要试图全部加载到界面。**