1

提高 Flex 应用程序性能的一个众所周知的事实是减少嵌套容器的数量，但这样做对我来说似乎特别困难。

我正在开发一个移动应用程序，并且在运行时调整我的一些组件的大小非常慢（我可以将组件切换到全屏并再次返回），我们说的是 500-1000 毫秒，这不是很好。不太复杂的组件会立即调整大小而没有明显的延迟，这就是我想要的所有组件。

让我们假设以下组件（当然简化了，有些组本身就是组件，但嵌套级别相当准确）；

<VGroup "the component's base">

   // I guess this is fine
   <HGroup "the component's title bar">
       <SkinnableContainer "title bar skin">
            <title bar components, labels etc. />
       </SkinnableContainer>
   </HGroup>

   <HGroup "options bar that has switchable components">
      <button />
      <array "holds 'views' for the options bar that can be switched">
           <HGroup "one option view">
               <option view contents, labels etc. />
           </HGroup>
           <HGroup "another option view">
               <option view contents, labels etc. />
           </HGroup>
      </array>
     <button />
   </HGroup>

这就是基本的组件布局。我不确定选项栏是否可以优化，这两个按钮用于切换本身放置在按钮之间的内容，因此是上部的HGroup. 数组内的组件也需要水平对齐，因此 child HGroups. 这已经下降到该组件中的嵌套级别 3，它本身已经是一个级别 3 的容器（由于我的导航）。

到组件的内容区；

     <Group "this is the content area">

     // this group needs two different layouts (vertical and horizontal) that
     // are switched based upon the user's choice of having the component maximised
     // or minimised 
     <layouts />

     // this list changes it's size based on the selected layout
     <List />

     this group also changes it's size based on the layout
     <VGroup>
        <scroller>
            // the group here holds a large label that needs to be scrollable
            <group>
        </scroller>
        <HGroup>
            <some basic components like `SkinnableContainer` and `Label` />
        </HGroup> 
     </VGroup>
   </Group>

这几乎是我表现最差（布局调整大小）组件的布局，结束标签......

</VGroup>

......我们完成了。

所以最大的问题是，是否有优化的空间？如果是这样，我可以从哪里开始？显然布局管理器在布局切换过程中要进行大量计算。不幸的是，由于这是一个移动应用程序，我根本无法使用绝对尺寸，因为我需要这个应用程序在各种平台和分辨率上工作，因此所有组都分配了相对尺寸，通常宽度和高度都是 100% .

我真的很想简化这一点，但我只是不知道从哪里开始。任何提示我可以做什么？

4

2 回答 2

2

我在之前的项目中负责过很多相同的事情，虽然没有一颗灵丹妙药可以解决一大堆问题，但它符合“千张纸剪死”的理论。

一些基于您的改进示例：

TitleBar： skinnable容器也有layout属性，为什么不直接去掉外面的Group外壳，以SC为基础开始呢？

<!-- <HGroup "the component's title bar"> -->
   <SkinnableContainer id="originalGroupId" "title bar skin">
       <layout>
          <HorizontalLayout /> 
       <layout>
       <title bar components, labels etc. />
   </SkinnableContainer>
<!-- </HGroup> -->

OptionsBar：不知道移动空间有没有限制，但是可以用一个使用INavigatorContent接口的容器吗？IE。本质上将使用一个creationPolicy标志，该标志只会创建容器的孙子，直到用户实际请求它。对于组，没有虚拟化的概念，因此所有组件都是在父级实例化时创建的。

<ViewStack "options bar that has switchable components">
  <button />
</ViewStack>

组件区域：这变得更具挑战性，有时它有助于（至少它对我有用）从 10,000 英尺的角度查看您真正想要显示的信息。例如，滚动一个很长的标签，你可以使用类似 a 的东西TextAera吗？如果是这样，那将消除外壳：

// the group here holds a large label that needs to be scrollable
<TextArea text="my really large label">

</TextArea>

希望有帮助...

于 2012-07-06T16:10:31.263 回答
0

可能无关紧要，但我也建议不要使用列表。也许它不一样，但我将我的一个组件从使用 List 更改为动态皮肤部件，并且所述组件的渲染明显更快（600 vs 100ms）。Spark 中的列表非常繁重。

于 2012-07-09T09:27:06.240 回答