1000+ Children in a Flex-Container

21 November 2007 | AIR / Apollo,Blogroll,flash,flex,maptech | Tags: , , ,

I want to add 1000+ child elements to a flex container that can be moved around with the mouse ( using startDrag / MouseEvent.MOVE). On a first try, i used a Canvas to hold the elements and a class derived from UIComponent as element. Adding 1K of children rendered the application almost completely unresponsive.

I had no idea where all the performance was going to.

Doing some reading on the web (AS3/AVM2 Performance Guide” @ Adobe website) i found that containers (with layout) were told to be expensive performance wise. Although i was using a (layout-less) Canvas i decided to go down deeper in the component hierarchy. After some research in the docs for display classes and display list workings, i found Sprite to be the component of choice. After resolving the issues of programatically redrawing the component (there is no updateDisplayList below UIComponent) and some sizing issues, i found the performance to be way (almost an order of magnitude) better.

Previously rendering 1K of symbols made the system almost unusable, now i can have 5K symbols with a reasonable responsiveness.

See this in action.


2 Responses to “1000+ Children in a Flex-Container”

  • 1 KARISHMA Says:

    i still can’t believe this nosence going around????why will people makeup a rumor like this??people are not crazy to see childern in a container an say things wat is not true??????? as a 13th year old m pearents are keeping me safe like they are keeping there money!!!!!!!

  • 2 ms Says:

    Maybe i need to change the headline … i never read it from that point of view.
    But reading the whole article (and not only the headline) helps … or am i missing a slight ironic touch in the comment … ;-)

Leave a Reply