Treeview slow with lots of node using a template

[Edward]

Hi,

Hoping someone might have a suggestion.

Basically i have a treeview that can potentially have 200 nodes each with a template applied to it. I have something like 
In my page init.

"TreeviewStructure.NodeTemplate = New TreeViewTemplate()"

Then you can click on any node and will show a modal popup. Problem is when the treeview has 200 nodes it seems to really struggle and take a age to open the modal popup, but if i remove the template its really quick.

So is there anyway not to have to load the template on each postback

Anyone have any ideas

Thanks

 

[Veselin Vasilev]

Hello Edward,

Can you please tell us what controls do you have in your TreeViewTemplate?

Do you use load-on-demand, or you load all the 200 nodes at once on every page load?

Ideally, you can open a support ticket and attach a sample project demonstrating the issue there.

Sincerely yours,
Veselin Vasilev
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Edward]

Thanks for the reply.

I've got something like the below. I expand all the nodes on page load as thats a requirement.

  Public Sub InstantiateIn(ByVal container As Control) Implements System.Web.UI.ITemplate.InstantiateIn
        Dim MainDiv As HtmlGenericControl
        Dim ImgDiv As HtmlGenericControl
        Dim LabelDiv As HtmlGenericControl
        Dim img As Image
        Dim pop As RadToolTip
        Dim popExtender As RadToolTip
        Dim lbl As Label
        Try

            'Create main div
            MainDiv = New HtmlGenericControl("div")
            MainDiv.ID = "divMenu"
            MainDiv.Attributes.Add("class", "TreeViewDiv")
            MainDiv.Attributes.Add("runat", "server")

            ImgDiv = New HtmlGenericControl("div")
            ImgDiv.ID = "div2"
            ImgDiv.Attributes.Add("runat", "server")
            MainDiv.Controls.Add(ImgDiv)

            LabelDiv = New HtmlGenericControl("div")
            LabelDiv.ID = "div3"
            LabelDiv.Attributes.Add("runat", "server")
            LabelDiv.Attributes.Add("style", "overflow:hidden")
            MainDiv.Controls.Add(LabelDiv)

            'Create the head image and add to main div
            img = New Image
            img.ID = "imgMenu"
            img.Attributes.Add("runat", "server")
            img.ImageUrl = "../images/head.png"
            img.ImageAlign = ImageAlign.Left
            img.Visible = False
            img.Style.Add("padding-top", "3px")
            img.Style.Add("padding-left", "1px")
            img.Style.Add("padding-right", "3px")
            ImgDiv.Controls.Add(img)

            'Create the label and add to main div
            lbl = New Label
            lbl.ID = "ItemLabel"
            lbl.Style.Add("font-size", "0.8em")
            LabelDiv.Controls.Add(lbl)

            'Create popup control
            pop = New RadToolTip
            pop.Attributes.Add("runat", "server")
            pop.TargetControlID = "imgMenu"
            pop.Position = ToolTipPosition.BottomLeft
            pop.RelativeTo = ToolTipRelativeDisplay.Element
            pop.AutoCloseDelay = 30000
            pop.Skin = "Outlook"
            pop.Title = "Users"
            pop.ID = "RadTip"
            pop.OffsetY = -5
            pop.OffsetX = -2

            popExtender = New RadToolTip
            popExtender.Attributes.Add("runat", "server")
            popExtender.TargetControlID = "div3"
            popExtender.Position = ToolTipPosition.TopRight
            popExtender.RelativeTo = ToolTipRelativeDisplay.Element
            popExtender.AutoCloseDelay = 30000
            popExtender.Skin = "Vista"
            popExtender.ID = "RadTipNodeName"
            popExtender.OffsetY = -5
            'popExtender.OffsetX = -300

            'Attach to the treeview
            container.Controls.Add(pop)
            container.Controls.Add(popExtender)
            container.Controls.Add(MainDiv)

        Catch ex As Exception

        End Try
    End Sub

Im only using the trial at the moment so can't submit a ticket, but i believe we are in the process of purchasing and so i've nessecary will create a ticket once thats done.

[Paul]

Hi Edward,

RadTooltip and RadTooltipManager are quite lightweight and generally there are no problems with performance. However, in templated scenarios the number of tooltip controls on the page can easily go out of hand. We have seen scenarios involving 1000+ tooltips on a single page. Since each of them needs to be initialized on client page load, the system takes a lot of time to do it, especially If <compilation debug=true>. In such scenarios there is a better approach to the tooltips – and that is using a couple of lines of client-side code that will create a tooltip only when the user needs to see it. The following demo demonstrates this approach.

Kind regards,

Paul
the Telerik team

 

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Matthew Timbs]

Hi,

I'm seeing exactly the same behavior, although I'm adding a set of radio buttons to the leaf nodes.  The treeview is databound, I'm using checkboxes and a NodeTemplate.  Speed is fine until I check or uncheck a box then it just drags horribly.  If I remove the NodeTemplate then its fast.

[Matthew Timbs]

One more snippet of evidence.  I'm using the "NodeCheck" event. When I remove the event handler it's fast again.  I need the handler, but it is interesting that it behaves this way.

[Veselin Vasilev]

Hi Matthew Timbs,

I think the best way to proceed is to send us a sample running project so we can test it locally.

All the best,
Veskoni
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.