Loading ...
Sorry, an error occurred while loading the content.

Panel Creation Performance Advice

Expand Messages
  • quantumblaster
    Hi, I m having load time performance problems. I m making a family tree and each person is represented as a panel on a background panel that s draggable.
    Message 1 of 3 , Jul 1 10:43 AM
    • 0 Attachment
      Hi,
      I'm having load time performance problems. I'm making a family tree and each person is represented as a panel on a background panel that's draggable.
      Loading times don't seems to be bad when there's ~20 panels
      http://www.thebui.net/yuigui/FamilyTree2.php
      but when there are 50...
      http://www.thebui.net/yuigui/FamilyTreeEdit.php

      The code loop for creating the panels is what takes up the time.
      x50
      YAHOO.panelI126732637 = new YAHOO.widget.Panel("panelI126732637", {
      width:"100px",
      visible:true,
      constraintoviewport:false,
      draggable:true,
      close:false
      } );
      YAHOO.panelI126732637.setHeader("Name Here");
      YAHOO.panelI126732637.setBody("<img src=cat.jpg width=75 height=75 align=center>");
      YAHOO.panelI126732637.setFooter("<div>emailAddress</div>");
      YAHOO.panelI126732637.render("I126732637");
      YAHOO.panelI126732637.show();
      YAHOO.util.Event.addListener("panelI126732637","click", toggleFooter,YAHOO.panelI126732637);
      YAHOO.util.Event.addListener("arrowI23423","mouseover", showMenu,);

      Any Suggestions? Alternatives? Use overlays instead of panels? The loading time is causing slow computers to think the script has hung. Should I not be using this many panels at all? Thanks.
    • Satyen Desai
      Hi, Normally I would advise reusing Panels, since in most cases there are only a handful or two of Panels visible at a given time, however in your case, it
      Message 2 of 3 , Jul 7 11:19 AM
      • 0 Attachment
        Hi,
        Normally I would advise reusing Panels, since in most cases there are
        only a handful or two of Panels visible at a given time, however in
        your case, it seems like all Panels are visible at the same time.

        To get around the initial page load delay, you can look at creating
        the Panels in smaller batches (e.g. 5 batches of 10) - invoking each
        batch in a timeout, to free up the thread.

        for (var b = 0; b < numberOfBatches; b++) {

        setTimeout(function() {
        // create next batch of n Panels
        } , 0);

        }

        Regards,
        Satyen


        On Jul 1, 2009, at 10:43 AM, quantumblaster wrote:

        >
        >
        > Hi,
        > I'm having load time performance problems. I'm making a family tree
        > and each person is represented as a panel on a background panel
        > that's draggable.
        > Loading times don't seems to be bad when there's ~20 panels
        > http://www.thebui.net/yuigui/FamilyTree2.php
        > but when there are 50...
        > http://www.thebui.net/yuigui/FamilyTreeEdit.php
        >
        > The code loop for creating the panels is what takes up the time.
        > x50
        > YAHOO.panelI126732637 = new YAHOO.widget.Panel("panelI126732637", {
        > width:"100px",
        > visible:true,
        > constraintoviewport:false,
        > draggable:true,
        > close:false
        > } );
        > YAHOO.panelI126732637.setHeader("Name Here");
        > YAHOO.panelI126732637.setBody("<img src=cat.jpg width=75 height=75
        > align=center>");
        > YAHOO.panelI126732637.setFooter("<div>emailAddress</div>");
        > YAHOO.panelI126732637.render("I126732637");
        > YAHOO.panelI126732637.show();
        > YAHOO.util.Event.addListener("panelI126732637","click",
        > toggleFooter,YAHOO.panelI126732637);
        > YAHOO.util.Event.addListener("arrowI23423","mouseover", showMenu,);
        >
        > Any Suggestions? Alternatives? Use overlays instead of panels? The
        > loading time is causing slow computers to think the script has hung.
        > Should I not be using this many panels at all? Thanks.
        >
        >
        >
      • quantumblaster
        ... Hi Satyen, Thanks for the help. setTimeout was the right way to prevent browser timeout. I ve also tried creating 50 empty modules to no avail. I guess
        Message 3 of 3 , Jul 23 10:46 PM
        • 0 Attachment
          --- In ydn-javascript@yahoogroups.com, Satyen Desai <sdesai@...> wrote:
          >
          > Hi,
          > Normally I would advise reusing Panels, since in most cases there are
          > only a handful or two of Panels visible at a given time, however in
          > your case, it seems like all Panels are visible at the same time.
          >
          > To get around the initial page load delay, you can look at creating
          > the Panels in smaller batches (e.g. 5 batches of 10) - invoking each
          > batch in a timeout, to free up the thread.
          >
          > for (var b = 0; b < numberOfBatches; b++) {
          >
          > setTimeout(function() {
          > // create next batch of n Panels
          > } , 0);
          >
          > }
          >
          > Regards,
          > Satyen

          Hi Satyen,
          Thanks for the help. setTimeout was the right way to prevent browser timeout. I've also tried creating 50 empty modules to no avail. I guess creating anything in the container class will take time. For my particular case, maybe it's better to try and use just plain code instead of the convience of panels. Once again thanks for the suggestion.
        Your message has been successfully submitted and would be delivered to recipients shortly.