Tips to boost performance of TileLayout?

Question

I am targeting mobile using FlashBuilder, I am using TileLayout to view items of data, I am setting useVirtualLayout to "true" I have some questions please:

1. Is item renderer resued by default? or shall I set it to true my self?
2. How can I control the range of items being virtualized?
3. Is there any tips on boosting performance of building child items of TileLayout ?

If native TileLayout is slow, is there alternative control to use? if building my own would be better, is there any example to build custom layout?

Answer 1

1. It is set to true by default. There are a few instances where they are not virtualized, however. If you have the list sizing to fit its contents, I don't believe virtualization occurs. If I am not mistaken, virtualization only occurs when an ItemRenderer leaves the viewport of the parent List control. So if you have a list on a page and that page is controlling the scrolling and not the list, I don't believe virutalization occurs. That is what I have seen in the past. Not sure if that is how it actually works, but that is the impression I have gotten. Easy way to find out is to throw a trace statement in your DataChange handler. If it traces out after initialization, you know virtualization is working
2. I'm not sure you can control this. You may be able to write a custom layout that does it, but that is likely more trouble than it is worth
3. The TileLayout itself is likely not the issue you are having, it is the ItemRenderer.
   • On mobile, do not extend any ItemRenderer class except LabelItemRenderer and IconItemRenderer.
   • Do not write a renderer in MXML. Write in AS3.
   • Utilize the proper renderer life-cycle. This means you should do very little in your constructor. Maybe set a few properties, but do not instantiate any DisplayObject. Instead, override createChildren() and do it there. Override layoutContents() for positioning and sizing. Override drawBackground() for handling the background. I highly suggest reading this post from Flextras (you'll see him going by Reboog77 on SO) about writing mobile item renderers. https://www.flextras.com/blog/index.cfm/2011/6/24/Building-a-Mobile-ItemRenderer-in-Flex
   • Keep the renderers as simple as possible. If you can get away with drawing directly into the object using the Graphics class, do that instead of using a Rect or similar.
   • Text is slow to render. Do not change it often and keep the text seen in the renderer to a minimum
   • Use ContentCache for any images outside of the iconDisplay in IconItemRenderer. ContentCache will negate the need for reloading images every single time.(iconDisplay/icon already utilizes this by default)