locked
WebApp design RRS feed

  • Question

  • User393148348 posted

    I'm working on a webapp and would like to discuss about the best way to structure the content.

    The typical page consists of a superior menu to navigate between the different sections, a treeview on the left with several items and the content of the selected item in the center, every item on the treeview can load the main content with diferent forms (every type of item has its own form).

    Now I have one UserControl for each section and one UserControl for each form type. When user select a section on the menu I load dynamically the UserControl of the section showing the asociated TreeView, then when the user browse the TreeView I load the proper UserControl on the main menu. Everything working with PartialRendering inside differents Updatepanels

    TreeView is big, loaded dynamically and some forms are big and complex too. For now everything is working fine but I read about performance problems loading dynamically controls and I would like to see other possible approaches before continuing.

    Avoid page flickering on navigation it's a must.

    Thanks.

    Wednesday, August 22, 2018 7:02 PM

All replies

  • User-893317190 posted

    Hi cojonuo,

    If you  don't want  to load all the data at a time in your tree ,you could consider jquey easyui's tree plugin or z-tree. 

    They all support load nodes asynchronously.

    For jquery easy ui tree, please refer to  https://www.jeasyui.com/documentation/tree.php

    jquery easy ui tree async mode : https://www.jeasyui.com/tutorial/tree/tree2.php

    Official site of ztree :http://www.treejs.cn/v3/api.php

    Best regards,

    Ackerly Xu

    Thursday, August 23, 2018 7:14 AM
  • User393148348 posted

    Indeed, I load the tree asynchronously using the Populate On Demand functionality of TreeView, for now everything is working well.

    I'm more worried about doing it wrong loading UserControls dynamically inside de page.

    Thursday, August 23, 2018 8:45 AM
  • User-893317190 posted

    Hi cojonuo,

    Could you tell us how you load your usercontrols with treeview?Could you post your code to let us know more about your requirement?What specific mistake do you worried about your usercontrol?

    Best regards,

    Ackerly Xu

    Monday, August 27, 2018 1:34 AM
  • User393148348 posted

    One simple tree example could be:

    Admin
    |- Max
    |- Bob

    For each type of node I know what type of user control I need to load, then when user select the node to see, I load the proper UserControl on one UpdatePanel. To do this I use the method:

    Page.LoadControl(string src)

    This UserControls could be heavy, for example 8-10 tabs with tens of fields, grids, custom controls, etc.


    I'm worry about performance impact of load the control dynamically against other methods. I use this method because I need a way to navigate between forms without page flickering. Is there a simpler solution?

    Monday, August 27, 2018 9:20 AM
  • User-893317190 posted

    Hi cojonuo,

    You could use outputcache to cache your usercontrol.Please refer to https://msdn.microsoft.com/en-us/library/h30h475z.aspx.

    https://msdn.microsoft.com/en-us/library/aa478965.aspx?f=255&MSPPError=-2147217396

    About dynamically load cached usercontrol , please refer to  http://burnignorance.com/asp-net-developer-tips/how-to-cache-dynamically-loaded-user-control/

    Please pay attention to the PartialCachingControl in the link. Usercontrol which is cached is not of type Cache. It is of type PartialCachingControl .

    Best regards,

    Ackerly Xu

    Tuesday, August 28, 2018 1:47 AM
  • User393148348 posted

    Thank you, I will read the articles that you suggest to improve performance, in other hand there are mainly about forms that user can edit, so I don't know if it is possible to cache this kind of controls. I need to read about it.

    I also thought to use an iframe, but I need to communicate this control with the other elements of the page and I thought it could be more complicated.

    In the end I believe that what I really need is to send the browser the required form on demand, and this is the only way I have thought of doing it.

    Tuesday, August 28, 2018 10:17 AM