5 Replies Latest reply on Aug 9, 2010 6:48 PM by deepa subramaniam (adobe)

    load speed: FLEX MX:TABNAVIGATOR LOAD SPEED VERSUS SPARK:TABBAR

    AICC Level 1

      TODAY I NOTICED A LARGE DIFFERENCE BETWEEN

      THE OLDER MX:TABNAVIGATOR

      AND NEWER S:TABBAR (SPARK)

       

      Summary:

      My test application was built in flex builder 4 and I was using my localhost (asp.net devlepment enviroment) for testing.

       

       

      Tests I built:

      I built many proofs for concept using flex objects, ui  and data handlers.

       

       

      HOW WAS THIS TEST (which I spoke about in the title) CREATED:

      I built two components which will be used as CHILDREN to the main application.  The fist child component used the SPARK TABBAR and the other child component used the MX:TABNAVIGATOR.  The main application declared these children (using action script) initially and a List control actually loaded the children into the main application.

       

       

       

      BOTH CHILD COMPPONENTS had 10 tabs....

      5 of the 10 tabs contained "grand" child components (none of the components(main application/children/grandchildren) worked with external data)

       

      RESULTS:

      THE LOAD SPEED BETWEEN THE TWO CONTROLS was very noticable between the two controls.

       

      THE SPARK COMPONENT (S:tabbar) AVERAGED 3-5 SECONDS TO LOAD

      WHERE THE MX:TABNAVIGATOR ONLY TOOK 1-2 SECONDS

       

       

      HAS ANYBODY ELSE EXPERIENCED THE SAME RESULTS?

       

      THANKS,

      DOUG LUBY OF LOUISIANA

      WWW.douglubey.com

       

       

       

      SEARCH:  FLEX MX:TABNAVIGATOR LOAD SPEED VERSUS SPARK:TABBAR

        • 1. Re: load speed: FLEX MX:TABNAVIGATOR LOAD SPEED VERSUS SPARK:TABBAR
          Shongrunden Adobe Employee

          Do you think that your test might be running into this bug http://bugs.adobe.com/jira/browse/SDK-26127 ?

          1 person found this helpful
          • 2. Re: load speed: FLEX MX:TABNAVIGATOR LOAD SPEED VERSUS SPARK:TABBAR
            AICC Level 1

            It definately seems to fit (pretty good).

             

            My labels in the "TABS" were of different length.

             

            So I converted them all to be the same length.

             

             

             

            <s:TabBar dataProvider="{viewstackSampleB}" id="sampleBMainTabBar"

            left="

            11" top="8" right="11" height="34" fontSize="6"/>

             

             

            <mx:ViewStack id="viewstackSampleB" cornerRadius="20" top="40" bottom="10" left="10" right="10">

             

             

            <s:NavigatorContent label="Profile___________________" width="100%" height="100%">

             

             

            <s:NavigatorContent left="0" top="0" right="0" bottom="0" backgroundColor="#000080">

             

             

            <sample:SampleB_Profile id="studentProfile" left="2" top="2" right="2" bottom="2"/>

             

             

            </s:NavigatorContent>

             

             

            </s:NavigatorContent>

             

             

            <s:NavigatorContent label="SampleB_DragNDrop1________" width="100%" height="100%">

             

             

            <s:NavigatorContent left="0" top="0" right="0" bottom="0" backgroundColor="#000080">

             

             

            <sample:SampleB_DragNDrop1 id="studentDragNDrop1" left="2" top="2" right="2" bottom="2"/>

             

             

            </s:NavigatorContent>

             

            </s:NavigatorContent>

             

             

            <s:NavigatorContent label="SampleB_DragNDrop2________" width="100%" height="100%">

             

             

            <s:NavigatorContent left="0" top="-3" right="0" bottom="0" backgroundColor="#AEAEAE">

             

             

            <sample:SampleB_DragNDrop2 id="studentDragNDrop2" left="2" top="2" right="2" bottom="2"/>

             

             

            </s:NavigatorContent>

             

            </s:NavigatorContent>

             

            <s:NavigatorContent label="SampleB_PullDataFromParent" width="100%" height="100%">

             

            <s:NavigatorContent left="0" top="-3" right="0" bottom="0" backgroundColor="#AEAEAE">

             

            <sample:SampleB_PullingDataParent id="studentPullingDataParent" left="2" top="2" right="2" bottom="2"/>

             

            </s:NavigatorContent>

             

            </s:NavigatorContent>

             

            <s:NavigatorContent label="Tab Five__________________" width="100%" height="100%">

             

            <s:NavigatorContent left="0" top="-3" right="0" bottom="0" backgroundColor="#AEAEAE">

             

            </s:NavigatorContent>

             

            </s:NavigatorContent>

             

            <s:NavigatorContent label="Tab Six___________________" width="100%" height="100%">

             

            <s:NavigatorContent left="0" top="-3" right="0" bottom="0" backgroundColor="#AEAEAE">

             

            </s:NavigatorContent>

             

            </s:NavigatorContent>

             

            <s:NavigatorContent label="Tab Seven_________________" width="100%" height="100%">

             

            <s:NavigatorContent left="0" top="-3" right="0" bottom="0" backgroundColor="#AEAEAE">

             

            </s:NavigatorContent>

             

            </s:NavigatorContent>

             

            <s:NavigatorContent label="Tab Eight_________________" width="100%" height="100%">

             

            <s:NavigatorContent left="0" top="-3" right="0" bottom="0" backgroundColor="#AEAEAE">

             

            </s:NavigatorContent>

             

            </s:NavigatorContent>

             

            <s:NavigatorContent label="Tab Nine__________________" width="100%" height="100%">

             

            <s:NavigatorContent left="0" top="-3" right="0" bottom="0" backgroundColor="#AEAEAE">

             

            </s:NavigatorContent>

             

            </s:NavigatorContent>

             

            <s:NavigatorContent label="Tab Ten___________________" width="100%" height="100%">

             

            <s:NavigatorContent left="0" top="-3" right="0" bottom="0" backgroundColor="#AEAEAE">

             

            </s:NavigatorContent>

             

            </s:NavigatorContent>

             

            </mx:ViewStack>

             

             

            THIS APPEARS TO HAVE THE SAME LOAD TIME as the TabNavigator.

             

             

            So I have to ask:

             

            What is a permanent fix for this.

             


            Where I can I update my current "Build" for FLEX 4
            so my application does not retain this bug.

             

            OR ANOTHER QUESTION...what can I exclude in my declarations to fix this bug.
            I would prefer to use the Spark TabBar over the mx:tabnavigator

             

            MY CURRENT "BUILD" is 4.0.1.277662

            • 3. Re: load speed: FLEX MX:TABNAVIGATOR LOAD SPEED VERSUS SPARK:TABBAR
              Flex harUI Adobe Employee

              mx:TabNavigator defers creation of components on the unselected children.

              How did you do that in Spark?  Did you wire TabBar to an mx:Viewstack?

              Otherwise, that's probably the difference.

              • 4. Re: load speed: FLEX MX:TABNAVIGATOR LOAD SPEED VERSUS SPARK:TABBAR
                AICC Level 1

                I think the difference in speed is related to the bug as was mentioned.

                 

                "When different size labels are used in TABBAR...the response tiime for rendering will be degraded"

                WORK AROUND: make all labels the same size/length and the speed for the TABBAR will be equivalent to the TabNavigator.

                 

                This is what I did and it worked..but really do not want to do this in a production application.  My application will not make it into production for 6- 8 weeks so I hope this is included with the ADOBE UPDATES before October 1st.

                 

                My question is ....when will the new build for the flex libraries be available so my code can use the Spark TabBar in place of the MX: tabnavigator.

                • 5. Re: load speed: FLEX MX:TABNAVIGATOR LOAD SPEED VERSUS SPARK:TABBAR
                  deepa subramaniam (adobe) Level 2

                  FYI - the fix for SDK-26127 (http://bugs.adobe.com/jira/browse/SDK-26127) has gone into the development branch for Hero, the next release of Flex SDK.

                   

                  We will be sharing a preview of Hero before the end of the year. You can see the fix then. Alternatively, we are working towards sharing early, modified builds of Hero SDK on our opensource site (http://opensource.adobe.com/wiki/display/flexsdk/Hero). Check back there to see availability of builds in the coming weeks.

                   

                  Thanks,

                  Deepa Subramaniam

                  Flex SDK Product Manager